We are working constantly on improving the performance of the sites created with Elementor. We have now focused on achieving a faster page load by reducing the amount of unused CSS generated by the pages by adding the Conditional and Inline CSS Loading.
Conditional CSS Load
Until Core v3.3.0 , all the CSS was loaded in the same file: frontend.css (120KB in Elementro core, 225KB in Elementor Pro ). This means CSS assets that are not in use are being loaded anyway, a thing that harms page score and generates render-blocking processes.
Now, we load only the CSS of the widgets that are placed in your page once. This way, we save up to 37KB of render-blocking assets (CSS) in Elementor Core, and save up to 171KB, based on your usage.
Inline CSS Load
In order to prevent multiple requests to the server, we are now loading the CSS files as inline style tags. This will reduce even further the render-blocking processes and should improve the overall performance (only up to 8KB, otherwise – the CSS file will be loaded as an inline link tag).
If the widget is being used more than once, there will not be an additional request or print.
The mechanism of understanding the CSS file size (the “expensive act”) will happen once for a widget.