⚡️ Optimize performance

此内容尚不支持你的语言。

Site performance is key for ranking highly in search engines and for keeping visitors on your site.

If a page is slow to load, visitors may leave your site and not come back.

Want to optimize the performance of your site for your visitors?

By default, Hugo Blox automatically applies state-of-the-art performance optimizations for you:

✅ Perfect 100% Lighthouse Performance Scores (on the Blog template, for example)
✅ Automatic Image Conversion to the ultra-fast, web-friendly WEBP format
✅ Responsive Images via srcset dynamically adapt resolution
✅ Lazy loading images on demand
✅ Prefetching pages before a user clicks on their links
✅ Prefetching and asynchronously loading assets
✅ Bundling and minifying HTML, CSS, and JS to reduce HTTP requests and file sizes
✅ Resizing high-resolution images to the size which they are displayed at
✅ Purging unused CSS styles for ultra-fast page loading

Increase your site’s performance even further

Here, you’ll find some general tips. However, each site made with the Hugo Blox web framework is unique, having different content, layouts, and customizations. Hence, for specific recommendations relevant to your site, run an analysis tool such as Lighthouse.

Suggestions for the fastest website:

Use the native font option in params.yaml
Simplify the homepage by moving resource-intensive homepage sections to their own dedicated landing pages
Try to avoid having too many Mermaid diagrams or Plotly charts on any one page
If you added any third-party scripts to your site, consider removing less important scripts to increase performance
- Many third-party scripts and services are bloated and can slow down a site considerably!
Avoid putting any images in the static folder, instead put images in the page’s folder or in the assets/media/ library where they will be automatically optimized
For simple (vector) images like diagrams, consider exporting your image in the SVG format