Stencil Documentation
  • General
  • API
    • Authentication
      • Account
    • Pagination
    • Status Code and Throttling
    • Endpoints
      • Projects
      • Templates
      • Images
      • Collections
      • PDFs
      • Airtable
    • Charts
  • Using Stencil
    • Template Editor (New)
    • Template Editor (Legacy)
      • Limited Markdown Supports
      • Anchoring Element
      • Using Custom Font
      • Circular Text Positioning
    • White Label for Business
      • Setting Up Your First Client
      • DNS Setup with Cloudflare
  • Guides
    • Airtable Integration
      • Basic
    • Integromat Integration
      • Connection
      • Instant Trigger
    • Zapier Integration
      • Authentication
      • Trigger - New Image
      • Action - Create Image
    • Secure Signed Image
      • Basic
    • Query String Integration
      • Basic
      • Cache
    • Forms Integration
    • Case Studies
      • Generate Instagram Post from WooCommerce
      • Generate Open Graph Image for WordPress
      • Generate Personalized SendGrid Email Campaigns
      • Sending Charts to Twitter
      • Generate Instagram Post from Shopify
      • Automating Webflow Open Graph Image
      • Generate certificate of accomplishment
      • Automate Candidate's Certificate Generation
  • LINKS
    • Back to Stencil
    • Got bug?
    • Need feature?
    • Blog
Powered by GitBook
On this page
  • Quota calculation
  • How it works?
  • 1. User sends a request
  • 2. CloudFront intercepts the request
  • 3. Stencil's cache
  • 4. Back to Cloudfront's cache
  • Headers

Was this helpful?

  1. Guides
  2. Query String Integration

Cache

How query string cache works

PreviousBasicNextForms Integration

Last updated 3 years ago

Was this helpful?

Quota calculation

In other word, you will only be charged when our server generates an image for you i.e. cache miss on our server.

How it works?

1. User sends a request

User's browser send a request to get an image. This image points to Query String URL integration that we have set up previously.

2. CloudFront intercepts the request

Images are cached on Amazon CloudFront. This is why Stencil image's load is so fast because we are using Amazon CloudFront to cache in multiple locations throughout the world.

If images are in CloudFront's cache, it will return the cache version (i.e. go to step 4 directly). Otherwise it will send a request to Stencil.

3. Stencil's cache

Stencil maintains a smart cache, we won't go into details on how it works but it can figure out whether you're generating the same image as before or it is a new image.

If a new image needs to be generated, your quota will be deducted. Otherwise, your usage remains unchanged.

4. Back to Cloudfront's cache

Amazon CloudFront will cache this image returned by our server. Any subsequent requests will hit Amazon CloudFront.

Headers

To assist with issues, image response header contains some useful information to know whether cache is working as intended.

Header

Description

x-cache

This is CloudFront cache header. HIT when retrieving from CloudFront's cache, MISS when image is not in CloudFront's cache.

x-stencil-cache

This is Stencil cache header. HIT when Stencil returns the image from its cache. MISS when Stencil generates new image.

x-stencil-error

If image fails to be generated, please check the status code and this header. This header contains the reason of image failure.

Sometimes you will getx-cache: HIT and x-stencil-cache: MISS within the same response. Don't worry, your usage will remain unchanged.

This happens when an image is first generated and the subsequent cache hit from CloudFront also caches this header value.

Network flow between user request, Amazon's Cloudfront and Stencil's server