Does anyone have any tips on how to update older style website front-ends?
What I mean by that is that the “old” way of doing things was to have separate assets, be it JS or CSS, that get loaded on demand for each page.
When measuring this on https://web.dev/measure/ for example, it will usually complain about several things:
- Too many resources
- Render-blocking resources
- Largest Contentful Paint (LCP) being too long
- Unused CSS
- Inline smaller images
What have you done to combat this? Combining and minifying all the resources seems to be one way of doing it, but that’s only half the battle. What tool-chains can you recommend?
Obviously this can be solved by re-doing the front-end in something newer like Gatsby, Vuepress, Gridsome, etc.that have this all built-in. I’m looking for a solution that doesn’t involve re-doing it, but can still access this newer way of doing things.
Should I be looking in the Gulp and Webpack direction, or something else?