Reputation: 75
My Website URL: http://gettycreations.com/
My Website is talking so much time to load because there are 300+ images on the home page. I checked it on "https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fgettycreations.com%2F&tab=desktop".
I tried to put the code here but I got this "Body is limited to 30000 characters; you entered 150616." error. Body does not allow put more than 30000 characters.
How may I solve that issue.
Thanks
Upvotes: 0
Views: 1428
Reputation: 89675
One thing that I noticed looking at your code is that you load all pictures, including pictures that will be shown only when user click on magnifying glass. For instance you are loading 3d-22t.jpg (12.9 KB) image, which is a right size image but you also load 3d-22.jpg, which is 584 KB image and it's not used until you click on magnifying glass. What I would recommend is to load small images like you are doing now, but not load big images, and only load full size images when user clicks on subnail. Use ajax to load those images.
I also noticed that your images are not cached, so every time I open your page all images going from your web server instead of from local cache. You can use A Last-Modified and Expires header for that.
This will improve your page load speed drastically.
For more information read: Image Optimization, How To Optimize Your Site With HTTP Caching
Upvotes: 0
Reputation: 3125
Try to load the images with JQuery once the page is loaded. An example:
$(document).ready(function(){
// Load your images here
$('.content').append("<img class='inline' src='/Images/img.png' />");
});
You can use a lot of tools to load content while you are scrolling down the page too.
Upvotes: 1