Are Aheto widgets optimized? #
Yes! All Aheto widgets are optimized and only include those files that are required to render the widgets on any given page.
You can see it:
- in the structure of each Widgets, where CSS and JS files are splited for own layout
- in View file of layout, where is registers the style/scripts and enqueues
Also Aheto generate one CSS with all styles from widgets that used on the page (each page has own css files) and added them to wp-content/uploads/aheto-styles folder.
Note. Header and Footer has own CSS file.
What I can do with CSS/JS for better performance on my website? #
There are three options for do better performance of widgets styles and scripts:
- Custom CSS Including
In Aheto we created functionality for including all css files from used widgets on page in one file (it include CSS from plugin’s and theme’s widgets).
You can see option for it in Aheto Dashboard -> Settings -> Optimization
and simple check for it in View file
2. Enable preload attribute for CSS
The preload value of the <link> element’s rel attribute lets you declare fetch requests in the HTML’s <head>, specifying resources that your page will need very soon, which you want to start loading early in the page lifecycle, before browsers’ main rendering machinery kicks in. This ensures they are available earlier and are less likely to block the page’s render, improving performance.
In Aheto we created functionality for it. You can see option for it in Aheto Dashboard -> Settings -> Optimization
3. Enable defer attribute for JS
The defer attribute tells the browser not to wait for the script. Instead, the browser will continue to process the HTML, build DOM. The script loads “in the background”, and then runs when the DOM is fully built.
- Scripts with defer never block the page.
- Scripts with defer always execute when the DOM is ready (but before DOMContentLoaded event).
In Aheto we created functionality for it. You can see option for it in Aheto Dashboard -> Settings -> Optimization