How Caching Works in Filepicker

There are three steps of caching in Filepicker. The following are Filepicker’s internal cache layers, with the first layer being the browser:

1. The first layer is the browser cache. Whenever Filepicker returns a file, whether it was converted or not, the file is loaded with a cache control response header telling the browser to cache the file.
2. The second is S3. All previously converted files are loaded from Filepicker’s S3 Bucket.
3. Before a file is converted, it will be stored in Redis.

Here’s this process further explained:

Browser Caching In Filepicker For Regular Files

The first kind of caching in Filepicker is for regular and converted files. This kind of cache is set in a user’s browser, and allows setting a cache control header in their HTTP response. There are currently only two browser cache options. If cache=true, the file will be cached for 10 years. If cache=false, it will not be cached.

Javascript Example

var input = document.getElementById("read-input");
var output = document.getElementById("read-result");
if (!input.value) {
    console.log("Choose an image to read below");
} else {
    filepicker.read(input, {cache: true},
        function(imgdata){
            output.src = 'data:image/png;base64,'+imgdata;
            console.log("Read successful");
        }, function(fperror) {
            console.log(fperror.toString());
        }
   );
}

REST Example

>>> curl -I https://www.filestack.com/api/file/hFHUCB3iTxyMzseuWOgG?cache=true
HTTP/1.1 200 OK
...
Cache-Control: public, max-age=315360000, no-transform
...
>>> curl -I https://www.filestack.com/api/file/hFHUCB3iTxyMzseuWOgG?cache=false
HTTP/1.1 200 OK
...
Cache-Control: no-cache
...

Caching for Converted Files Explained

If this were a new conversion, the first request to convert this file with its set of parameters would take a little extra time as this conversion will be performed.

Once a conversion request is completed, the converted file is delivered to Filepicker’s S3, and the original file is stored in our Redis server.

Every subsequent request with the same parameters will be cached delivered from S3 to prevent from being converted multiple times.

The original file is stored in Redis for different conversion requests. Then, the file doesn’t have to be sourced from it’s original location, and increases the speed of conversions.

Filestack

Filestack is a dynamic team dedicated to revolutionizing file uploads and management for web and mobile applications. Our user-friendly API seamlessly integrates with major cloud services, offering developers a reliable and efficient file handling experience.

Read More →