Considerations on a new feature: serving (dynamic) CMS content through a CDN

We will discuss the implementation of an awesome feature: 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.

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:

https://getpop.org/en/?output=json

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:

https://getpop.org/en/?output=json&thumbprint=3452223554222

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:

  1. The user clicks on https://getpop.org/en/
  2. 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
  3. The CDN, if it doesn’t have this entry, will fetch it from https://getpop.org/en/?output=json&thumbprint=3452223554222
  4. The server gives the response
  5. The CDN caches the response, and returns it to the client
  6. 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

Welcome to the PoP framework!
Break the information monopoly

the PoP framework is open source software which aims to decentralize the content flow and break the information monopoly from large internet corporations. Read more.


Sign up to our newsletter: