Back to all questions

What Types of Content Can be Cached by a CDN?

Roei Hazout
Caching
July 28, 2024

Content Delivery Networks (CDNs) can cache a variety of content types, including static assets like images, CSS, JavaScript files, and dynamic content that can be precomputed. 

Here's the lowdown on what types of content can be cached by a CDN and how it works.

Static Content

  1. Images: One of the most common types of content cached by CDNs via proxy caching. Formats like PNG, JPEG, GIF, and SVG are cached to speed up loading times for users.
  2. Stylesheets (CSS): CSS files define the layout and design of your website. By caching these files, CDNs ensure that the site loads faster as the styling doesn’t need to be re-fetched from the origin server each time.
  3. JavaScript Files (JS): All the scripts that make your site interactive can be cached. This includes libraries like jQuery, custom scripts, and any third-party scripts that don’t change frequently.
  4. Videos: Large video files can also be cached. This is particularly useful for sites that host video content, as it reduces the load on the origin server and speeds up delivery to the user.
  5. Fonts: Web fonts (e.g., Google Fonts) can be cached to ensure quick and consistent text rendering across your website.
  6. Documents: PDFs and other document types that are frequently accessed can be cached to reduce the load on the origin server.

{{cool-component}}

Dynamic Content

While static content is straightforward, dynamic content poses a bit of a challenge. However, CDNs can still cache certain types of dynamic content under specific circumstances:

  1. APIs and AJAX Requests: Responses from APIs that don’t change often, such as user profiles or product listings, can be cached to improve performance.
  2. HTML Pages: Some HTML pages, particularly those that don’t change frequently, can be cached. This can include blog posts or other content pages that are updated periodically.
  3. Personalized Content: With the help of modern CDN features like Edge Side Includes (ESI) and dynamic content assembly, personalized content can also be cached efficiently. This involves caching static parts of the page while dynamically loading personalized elements.

How Caching Works With Different Content Types

Here’s what CDN caching can do for you depending on the content type:

  • Data Caching: This is the process of storing copies of files in multiple locations. When a user requests a file, the CDN delivers it from the nearest server, reducing the time it takes to access the data.
  • CDN Caching: Involves storing content on multiple servers distributed across various locations. This reduces latency and speeds up load times by serving content from the closest server to the user.
  • Browser Caching: Although not strictly CDN, browser caching is crucial. It stores resources on the user’s device, reducing the need to download files again on subsequent visits.
  • File Caching: By storing copies of files closer to the user, CDNs reduce the distance data needs to travel, thus speeding up access and reducing the load on the origin server.

Examples of Cached Content in Different Scenarios

  1. E-commerce Websites: Product images, CSS stylesheets, JavaScript for interactive elements, and even certain API responses like product details can be cached to enhance the shopping experience.
  2. News Websites: High-traffic news sites benefit from caching images, videos, and articles to manage sudden traffic spikes and ensure the site remains accessible.
  3. Blogs: For blogs, caching images, CSS, JavaScript, and even HTML pages of blog posts can significantly improve load times for readers.