Content type

Filter requests by content type to analyze bandwidth consumption across your project. Identify the highest bandwidth content types, such as image assets, so you can optimize them to improve performance and reduce resource costs.

Observability shows you the content type of your project’s web requests. Content-Type is a standard HTTP response header that indicates the media type of the returned content.

Your request may have no content type when one or more of the following is true:

• when the response body is empty and you get a response with a 204 No Content status code
• redirects, which have a 3XX status code
• internal server errors
• injected scripts

Most common content types

We recommend monitoring for the most common content types to understand how your project’s production performance and resource usage.

Content-Type	Used for	Description
application/javascript	JavaScript files	Often the largest bandwidth consumer. Monitor for large bundles.
text/html	HTML web pages	Core site content
application/json	JSON data files	Can indicate excessive data loading or prefetching for specific frameworks, such as Next.js data or Gatsby page-data.json. High volume warrants investigation.
text/css	CSS stylesheets	Styling files
text/plain	Plain text files	Various text content
image/webp	WebP images	Modern image format
image/png	PNG images	If larger than a few hundred KB, consider using Image CDN
image/jpeg	JPEG images	If larger than a few hundred KB, consider using Image CDN
image/svg+xml	SVG vector graphics	Scalable graphics
font/woff2	Web fonts	Can be heavy in terms of bandwidth
application/octet-stream	Binary files	Assorted files (e.g., JavaScript source maps, various binary content)
image/vnd.microsoft.icon	Favicon files	Typically .ico files
video/mp4	MP4 video files	High bandwidth usage
application/pdf	PDF documents	Document files

Framework-specific content types

Content-Type	Framework	Description
text/x-component	Next.js 13+	Pre-fetching components to load content before content is requested to improve performance. Built-in for frameworks such as Next.js, Remix, Gatsby, SvelteKit, etc. Astro can use pre-fetching if configured.
application/vnd.ms-access	Gatsby	Gatsby data files (e.g., /j94r24d0-a3fb-4bb0-8d9b-34c35d2fbc2d-data.mdb) for Gatsby sites using SSR that read from the Gatsby data layer during server-side rendering.

Further reference

For a comprehensive list of content-type values, check out the IANA Media Types reference docs.

To learn more in general about content type, check out the MDN Web Docs for Content-Type.