Very slow first load time problems
I recently discovered the loading times for my homepage (www.grafoman.be) were reaaaalllyyy long..
Ran a test and this is the result (see screenshot)..
So you can see the first load time is 18 seconds!
Login in the dashboard takes forever.
Running 5.7 with theme Long Story Short.
I can't find any errors in my code..
Any help would be appreciated.
On your screenshot, it looks like the main issue is building the html rather than any assets.
Load times are often different between logged in and not logged in - when logged in you need a lot of dashboard stuff.
Is your database on the same server? If its separate, the comms overhead can cause long load. Is it shared hosting? That can often depend on who you are sharing with.
As an aside, you do have some duplicated assets like fontawesome.
The images in your portfolio section need major optimisation.
First image 242KB (1B.png), I got it down to 33KB.
Second image 279KB (4B.png), I got it down to 33KB.
Third image 397KB (2B.png), I got it down to 37KB.
You will need to optimise ALL images and add ‘max-age and expires’ to your .htaccess file for all files.
See my attached versions of your images.
For better breakdown and help use:http://www.webpagetest.org/
You might be using 'Photoshop", I use 'Fireworks'. However if you want a great alternative, try using PhotoScape.
It's free for both Mac and Windows: http://photoscape.org
Part of the problem is you are testing your site against a server in Dallas, Texas. Unless you are using a CDN, or similar, you will want to test your site against an EU server.
If you test your site from Amsterdam, Netherlands, it loads in 4.08 seconds.
This will help also to reduce the image size depending on the screen size.
However when i'm running speed tests, i still have issues with the first byte time and the number of requests (currently at 136!).
Anything i can do about this?
You could also try a lazyload script.
I use: https://github.com/aFarkas/lazysizes...
As for the lazysizes script. If I understand it correctly i have to add the class 'lazyload' to each image? Seems like a hassle?
EDIT: i used the code from user studio108 (see his link!)
Examples and help: http://afarkas.github.io/lazysizes/#examples...
Edit: check the screenshot for another example..