Frontity Docs
  • ยป Welcome to Frontity
  • ๐Ÿš€Getting started
    • Quick start guide
  • ๐Ÿ“ƒAbout Frontity
    • Frontity features
    • Browser support
    • Get involved
  • ๐Ÿ“šCore Concepts
    • 1. Project
    • 2. Settings
    • 3. Packages
    • 4. Roots
    • 5. State
    • 6. Actions
    • 7. Libraries
    • 8. Namespaces
    • 9. Styles
  • ๐Ÿ—๏ธArchitecture
    • Decoupled Mode
    • Embedded Mode
  • ๐ŸŒŽDeployment
    • Deploy Frontity using Vercel
    • Deploy Frontity on Layer0
    • Deploy Frontity on Heroku
  • ๐ŸŒ—Isomorphic React
  • โšก๏ธ Perfomance
    • Caching
    • Link prefetching
    • Lazy Loading
    • Code Splitting
  • ๐Ÿ”ŽSEO
  • ๐Ÿ“–Guides
    • Setting the URL of the WordPress data source
    • Using Environment Variables in a Frontity project
    • WordPress requirements for Frontity
    • URLs in a Migration from WordPress to Frontity Decoupled Mode
    • Frontity Query Options
    • Redirections with Frontity
    • Understanding a Frontity project
    • Add a new Frontity package or theme to your project
    • How to share your Frontity project
    • Understanding Mars Theme
    • Working with processors
    • How to process page-builder content in Frontity
    • Keep Frontity Updated
    • Troubleshooting
    • JavaScript
    • React
  • ๐Ÿ‘Contributing
    • How to contribute?
    • Contributing Guide
Powered by GitBook
On this page
  • Table of contents
  • Distributed caching (CDN)
  • CDN for Frontity servers
  • CDN for WordPress servers
  • Server caching
  • Server caching for URL requests in WordPress servers
  • Server caching for REST API requests in WordPress servers

Was this helpful?

  1. โšก๏ธ Perfomance

Caching

Previousโšก๏ธ PerfomanceNextLink prefetching

Last updated 4 years ago

Was this helpful?

With a good caching strategy your Frontity project can be as performant as a static site.

In Frontity projects we can implement two main types of caching:

  • Distributed Caching (CDN): The responses of requests are cached and distributed on a Network of Servers (CDN) so next requests for the same content can be directly delivered from the closest server from your location

  • Server Caching (WordPress Cache Plugins): The responses of requests are cached and stored in the server so next requests for the same content can be directly delivered from memory saving processing time. This strategy will mostly be managed by WordPress Cache Plugins in Frontity Architectures.

Table of contents

Distributed caching (CDN)

Adding a cache layer to cache your URL requests is the most effective way to speed up the delivery of your pages as most of them will be delivered from a server very close to the user's location and no processing time will be required

CDN for Frontity servers

CDN for WordPress servers

Server caching

Besides using a CDN to cache your requests, another cache layer can be added at a Server level. This cache will create a local copy of the requests so next time the same page is requested it will be delivered from the local copy (saving processing time)

Server caching for URL requests in WordPress servers

If the URL requested is cached, the plugin will return the content and no further requests will be done to the Frontity Server (or the WP REST API)

Server caching for REST API requests in WordPress servers

Caching REST API requests is highly recommended in both Decoupled & Embedded Mode asi it will also speed up the general response time of your site

Based on our experience working with media publishers, we recommend that you select a service offering the cache directive, which is the best cache technique for Frontity projects.

If you're using (main domain pointing to the Frontity server) our recommendation is that you host your Frontity site with that includes a distributed cache network.

In :

The caches your content at the edge in order to serve data to your users as fast as possible.

Vercel includes both a CDN and the stale-while-revalidate cache directive (which they call ). Their service is the quickest and easiest to set up, and you can follow our guide to .

If you prefer another hosting or want to deploy your Frontity site as a function by using services such as , or , we highly recommend you to add a CDN (such as a ) as it is key to improve your web performance.

We have tested many solutions for CDN and stale-while-revalidate, and we consider that the best options for this approach are and .

If you're using your main domain will point to your WordPress installation. In this architecture all the Cache solutions you were using for your WordPress will still be valid for Frontity using this Embedded Mode.

In WordPress there are several and to add a CDN Cache Layer to your site. This CDN implementation can be managed directly from your hosting provider or from a WordPress plugin

In the , the main domain is connected to the WordPress server which will redirect the to the Frontity Web Server to get the proper HTML based on the data of the WP REST API.

In this case, a service to cache the URL requests managed by WordPress can be implemented via a WordPress plugin. This can be done easily though some of the

This can also be done easily though a such as

With you'll have to , so REST API requests are properly cached

stale-while-revalidate
their own words about caching
Vercel Edge Network
Serverless Pre-Rendering
deploying Frontity using Vercel
Serverless
AWS Lambda
Netlify
Google Functions
Cloudflare
KeyCDN
StackPath
solutions
plugins
cache plugins available for WordPress
cache plugin that supports REST API
Simple Cache plugin
Simple Cache plugin
turn REST API and Headers options ON
Distributed caching (CDN)
CDN for Frontity servers
CDN for WordPress servers
Server caching
Server caching for URL requests in WordPress servers
Server caching for REST API requests in WordPress servers
Vercel
Embedded Mode
Embedded Mode
Decoupled Mode