I recently moved my website from wordpress to Hugo to optimize my website.
My problem is that after I moved it, performance score is kinda low.
I tried to optimized issues of google light house pointed out. But since I move the website from wordpress, I am using same css and js files.
There are too much css styles which I don’t use.
Question:
The simple answer is: Do not include it. The more detailed one: Check, what you really need. Like Bootstrap and fontawesome – why include that if you do not really need it?
You should perhaps, if Google’s performance rating is important for you. But frankly: Their lighthouse numbers show a big variation, so I wouldn’t trust them too much.
Sure. But that is not on-topic here. Nor are your other questions, by the way. Optimizing websites has nothing to do with Hugo, but with how you construct your site. Including un-used (and unnecessary, I guess) frameworks is one aspect.
Christian Oliff has a great video on how to use PurgeCSS to remove unused css.
Modern Image Format.
HUGO Provides Powerful image processing that can help you optimize, resize, and can convert jpg images to webp. Joost van der Schee has a great video on resizing and optimizing images using HUGO.
If you need to convert your PNG files to AVIF please see Pawel’s guide on converting images using the command line.
Self Host Fonts, Icons, Javascript and minimize requests.
