There is a specific array of paths to .css , .ttf , .jpg , etc. files. How to load them so that when creating elements that use these files (for example, a div with the background-size: url(image.jpg) property background-size: url(image.jpg) ), the browser does not load them again?

    1 answer 1

    You do not need to think about it. The browser does this for you automatically, provided that you have not turned off caching. The DevTools Network tab shows what is loading from where. You can also configure caching in .htaccess or in nginx, depending on what kind of web server you have.

    • The trick is that while the files are uploaded, the download animation will be displayed. Only after a full download of all the files you need to rebuild the DOM. You can do it in a standard way, but you don’t really want to install separate handlers for 15 files. Moreover, some of them are images that are used only in CSS and fonts. DOMContentLoaded is not appropriate in this case. - Andrei
    • Make a list of resources, create elements manually document.createElement, add a listener addEventListener to the load event. When everything is loaded, do what you want. - Profesor08
    • Suppose Then how to download fonts? - Andrei
    • Well, upload the file as you like, even through ajax. Although on a hidden canvas write something in this font. - Profesor08
    • Then how to catch the moment when the font is loaded? - Andrei