Available on: Newsmag V2.2+, Newspaper V6.4+
Ajax preloading is a technique use by our themes to make the user experience of sites that use the ajax filters on our blocks better. When active the theme will preload content for the ajax filters before the user clicks on them at the initial page load. Used responsively and paired with a full page caching plugin it can save a lot of requests done to admin-ajax.php.
Without ajax filters autoloading:
- the initial page generation is faster. After the page is cached by a caching plugin this advantage is lost because the plugin will serve static HTML
- smaller page size, in our measurements on a typical page will be smaller by 20-70kb when compressed via gzip. (Usually all servers should serve gzip content)
- our blocks use the WordPress provided endpoint for ajax operations admin-ajax. On each request this endpoints loads the full WordPress core and also the wp-admin core that is not used by our blocks
- admin-ajax endpoint is usually not cached by 3rd party plugins and most CDNs avoid caching it because it’s also used by wp-admin.
With ajax filters auto loading
- after the initial page is rendered and it’s cached by the cacahing plugin, all the other users that click on the filters will not hit the server. All the content is already on the users browser and all the code runs there.
- it provides a better user experience, especially on the mega menu
- the initial page load is way slower, for example if it’s used on almost all blocks it can generate a 40% slower loading speed but once the page is cached by a full page caching plugin, the loading time will be as with any other static HTML page.
- the page size is bigger
Where can I find it?
The preloading option is available on all blocks that feature an ajax filter and as on all the mega menus that have subcategory filters and it has the following three options:
- no preloading – the theme will make an ajax request on each click on a filter. After the request is made the theme is using a browser cache to store the result and not make an aditional request for the same resurce until the page is reloaded.
- optimized preloading – the theme tries to auto load the first filters
- preload all – the theme will try to load all the filters