What makes the ComboStrap performance so fast?

Bring your users the best experience

Page Speed Performance


performance is how fast your page will be perceived by your user from the moment they click on a link until they see the resulting page.

Google has a more detailed definition of what performance is and gives you a performance score along with performance metrics via the lighthouse product.

Below is a run of the home page of this website with the lighthouse website version. Note that our web server is running on a small machine with only 2 cores from Canada.

Page Speed Performance

Public Performance

If you want to speed up the performance of your application for search engine, you should follow the steps of this article I

Elements of performance

This section highlights the elements of page performance and what we do about it.


Critical Path

All published stylesheet (bootstrap and bootswatch) are served by default from a CDN

If you are using only ComboStrap, you can even disable the DokuWiki Stylesheet for a public user with the disableDokuwikiStylesheet configuration

The size of a web page served to the public (user not logged in) can be optimized with the CSS optimization module.

Stylesheet Preload

We preload stylesheet that are non critical for rendering. For instance, the stylesheet used for animation are preloaded and added to the page at the end.


All Javascript file are served from a CDN and are deferred (loaded at the end) because they are not needed for the first rendering.

If you only depend on the ComboStrap plugins, you can even disable the backend javascript for public pages.


The cache is the most important part of any performance system.


We follow the Google best practices on image

Lazy load

All images are lazy loaded if possible.

Lazy loaded means that they are loaded only when:

  • they are on the screen
  • they are going to enter on the screen.

Above the fold images

We don't lazy load images in the main header because they are directly visible to the user. The user does not need to scroll to see them. The official term is Above-the-fold image.

If these images are lazily loaded, they delay the largest contentful paint performance metrics.

If you put Above-the-fold image, the writer should set the lazy attribute to none.

Automatic Responsive Sizing

All raster images (jpg, png, …) are also automatically loaded with the appropriate sizing.

If a page contains an big image (say 2400px), this image will be resized and served to 300px on a small mobile screen.

If you want to see it in action, you can check the demonstration video.

Showcase yourself and your brand

Get free news, tips, and tricks
to create a remarkable experience for your readers.

Related HowTo's
Reduce Unused Javascript Dokuwiki Lightouse
How to speed up your page performance for search engines?

public front end optimization is a ComboStrap module that reduces the page overhead when a public / anonymous / search engine user is navigating your website in order to speed performance and increase...

Recommended Pages
Automatic Slot Cache Management

Thanks to the automatic slot cache management, the secondary slots cache is managed automatically and are re-rendered in the background
Cache Management

All the caches are explained in this page, from pages to images
Undraw Growth Chart R99m
How ComboStrap tackles SEO to bring you more visitors?

seoSearch engine optimization (or SEO) is the process of making your website optimized for search/enginesearch engine (Google, Bing, ...) to get to the top of their result. On a website level, it means:...
SVG to fitViewport 1Viewport 2--------------- meet ---------------xMin*xMid*xMax*---------- meet ----------*YMin*YMid*YMax---------- slice ----------xMin*xMid*xMax*--------------- slice ---------------*YMin*YMid*YMax
How to use a SVG in ComboStrap

ComboStrap supports natively SVG and allows you to use them as image, illustration and background
Stock Image Surfer In The See
How to use the image tag in ComboStrap

Combostrap supports raster and vector images. This page shows you how to add an image with syntax and examples.
Page Explorer List Name To Ui Region
Page-explorer: adding page navigation easily to your website

With the page-explorer component, you can add an explorer like panel that will list your pages in a list or collapsible tree fashion
What is the Public Page Cache?

For a anonymous user or a search engine, a page may be served from the public cache: speeding the rendering of the page and therefore improving the seo performance score The public cache is enabled...

Task Runner