Hello,
We can use up to 3 types of content preloading but I would like to know when each one is recommended: no preloading, optimized preloading and preload all. It is not clear to me, depending on the part of the page that should be loaded, what is the recommendation from you to carry out to improve performance.
Greetings and thanks.
Hi Vlad
The answer is a little short, although I understand that the best option is “default”. I was hoping for a link to documentation on the subject specifying different choices.
I tell you an example, so you can understand which is better. The first rendering is what matters to me. If you look at this url https://www.trebol-apuestas.com/blackjack/ there are several elements that I want to preload the block with the different bookmakers, that is why I add the option “Preload All”. This is a flex block with six elements and “I think” it makes it faster that way in this example, as it prioritizes the loading of the visible elements. And in this case the top image “Inline single image” is also an element that I would like to be prioritized when loading and not have the Lazy Load option. What can be done in this case with images that appear at the beginning to optimize the load. I leave you this video so you can see the aspect in TagDiv. https://www.loom.com/share/77209f86d3df4342be06b20c408ed16b
Hi,
Just to be clear and avoid misduerstandings, what preloading are you referring to? For what elements and how exactly are you planning to preload them, or what option are you referring to?
Preloading or prioritizing the content above the fold is indeed useful. The blocks have an option for preloading the posts they display – https://i.imgur.com/3DpX6Mz.png That is available for blocks and per block only however, not the whole page or other elements from the page.
Preloading posts in a block means they will be displayed faster when using the ajax menu filter, as they are already loaded on page load. Opposed to using the ajax menu and waiting a little for the posts to load.
The relatively new CSS analyzer tool we added a few updates ago also helps, with the CSS. It will split and load the critical CSS first, and the rest will be loaded in the footer.
Preload capabilities are usually provided by optimization plugins or caching plugins, for example – https://onlinemediamasters.com/preload-key-requests-wordpress/ Some have options to preload specific resources and URLs. The theme has no actual general preload option/setting for a website.
These being said, how exactly could we help in the matter? Let me know.
Thank you!
Ok Simion,
I have been reviewing the article and I have several of the plugins that it indicates. I will try to implement some improvements.
But in this particular case one of the problems with the images is the CLS. The “Inline single image” elements can be centered but you cannot specify WIDTHxHEIGHT which causes problems with the CLS and blocking time because it has to restructure its scale during loading, causing problems with rendering. On the other hand, the “Single image” element does have both variables WIDTHxHIGHT, but the problem is that the “Single image” elements cannot be centered. How could I focus them on my case? I leave video to document it https://www.loom.com/share/77b443185583405fa328727fdc5e5371
Cheers and thanks for your time
Hi,
Indeed, for the moment not all image elements have the height and width option. We’ll try to add them in the coming theme updates.
The single image is set as background, and that is way do not have set the align options, but you can center the single image by adding left and right margin auto https://i.imgur.com/NxJWQl0.png
I hope this will help you!