We have started working on a feature which has us very excited: making all (dynamic) content in the website immutable, or “static”, so that it can be served through a CDN. Once implemented, visitors will be mainly accessing the website through a CDN, and only when posting content, or fetching personal data, they will access the server.
This development has the following advantages:
- It lowers down the cost of operating a website, since a single small server is possibly enough to generate the static content and process the POST operations (assuming that reading activity in the website is much greater than writing activity)
- It makes the website faster, since content is served from a location near the user
- The content is still created dynamically, through a CDN. The static version is only generated on runtime. So, there is no need to replace the CMS with a static site generator
How will it work? As explained on the GitHub issue:
After loading the initial app-shell (which loads all .js and .css files, and outputs some configuration), the website solely operates by doing JSON requests. This is done by simply adding parameter output=json to the URL to load, eg:
This JSON output is mutable, since it contains dynamic content, such as posts, users’ data, etc. However, it can be made immutable, or static, simply by adding a “thumbprint”, i.e. a number to express the last time any value was inserted/updated/deleted (eg: a post was created, a comment was added, a user changed his/her name, etc), like this:
The addition of the thumbprint allows the content to become static, because if content has been updated, a new “latest thumbprint” will be generated, and this new value will be added as a parameter to all JSON requests. In order to always get the latest thumbprint, a process in background must always get this value from the server, either every x amount of time (such as is currently done to fetch the notifications), or through WebSockets.
The thumbprint is hidden to the user: it is added in runtime, after the user has clicked on a link. After the thumbprint has been added to the requested URL, the request can be routed through a CDN instead of going straight to the server. This way, dynamic content will have become static and delivered to the client from a location near the user:
- The user clicks on https://getpop.org/en/
- PoP modifies the URL to be requested, adding the thumbprint (and output=json), and changing the domain pointing to the CDN: https://cdn.getpop.org/en/?output=json&thumbprint=3452223554222
- The CDN, if it doesn’t have this entry, will fetch it from https://getpop.org/en/?output=json&thumbprint=3452223554222
- The server gives the response
- The CDN caches the response, and returns it to the client
- Next time a user clicks on https://getpop.org/en/, if the thumbprint has not changed, then this content will be fetched from the CDN
We expect to have this feature ready around second week of April.