Coming soon: serving (dynamic) CMS content through a CDN

Copied from https://getpop.org/en/blog/coming-soon-serving-dynamic-cms-content-through-a-cdn/.

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:

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

We expect to have this feature ready around second week of April.

Bienvenidos a PoP Demo!
Yet another “breaking the information monopoly” website

Use PoP Demo para ver cómo funciona un típico sitio web PoP. Juegue con el mismo: cree una cuenta de usuario, agregue un post, añada comentarios, siga a otros usuarios, recomiende contenido…