I'm looking to implement a preloader on my website to ensure everything is fully loaded - images, JavaScript, fonts, etc. However, I'm unsure whether to use the following:
window.addEventListener('DOMContentLoaded', () => {
// code
});
or
window.addEventListener('load', () => {
// code
});
If I decide to go with load or DOMContentLoaded, should I still utilize defer for my script files?
Additionally, if I have imported modules, should they be placed outside of the event listener? For instance:
import { gsap } from "gsap";
window.addEventListener('DOMContentLoaded', () => {
// code
});