Site load time
Hi,
Can you anyone suggest how I can improve load time for a website with a lot of images. Images and js files are compressed already. We haven't tried CDN yet.
6 comments
I agree with ig1; If you are concerned with performance, one of the first steps is to measure the performance in order to get an idea of where the issue(s) are. Is your Website Static or Dynamic? If your Website is Dynamic (aka, uses a Database on the back end) then the process of measuring is a bit more complex. Generally speaking, one of the common methods used to increase performance is to minimize the number of calls. This is usually accomplished by optimizing the code. For example, taking a large number of images and combining them into a single image sprite, and then using CSS to load the correct pixels of the sprite. In this example, the single image (aka image sprite) is called and downloaded to the user once, instead of 20 images being called and downloaded 20 times. This can also apply to Dynamic Websites that use a Database on the Back End, for example, making a single call to the Database instead of multiple unnecessary calls (just an example). A Content Delivery Network (CDN) is another possible solution, but that will only increase performance at the transport layer, and will not solve problems with inefficient code, or potential issues on the back end. By measuring your performance, you'll have a better idea of where to look.
The website is Dynamic. Thanks for the suggestion but I'm not sure how we can make a single call to the Database for multiple images and videos. Is there a blog I can refer?
Thank you
Thank you
No problem, glad I could help. I don't have a Blog to refer to, but I can give you a simplified example.
Imagine you are loading a Page with 20 Images out of the Database. The "slower" approach would be to query the Database for each Image individually, which means 20 queries to load 20 images. The "faster" approach would be to query the Database for all 20 images at once, which means 1 query to load 20 images.
Optimizing the Database end of a Dynamic Website (or Service/App) could be considered a specialty in itself, and it can get pretty complex; Indexing, Caching, even designing the Database Structure and Code a special way. I put the terms slower and faster in quotes because everything is relative, and your mileage may vary. If you are using a framework (like Wordpress for example), then it's possible that someone already put some thought into optimizing the calls.
The first step is to measure and determine where the bottlenecks are. You may find out that you don't even need to worry about the Database (depending on your performance measurements). To get started, check out Google Chrome’s Developer Tools (Resource Analysis), or WebPageTest.org (just some examples of tools you can use). Good Luck!
Imagine you are loading a Page with 20 Images out of the Database. The "slower" approach would be to query the Database for each Image individually, which means 20 queries to load 20 images. The "faster" approach would be to query the Database for all 20 images at once, which means 1 query to load 20 images.
Optimizing the Database end of a Dynamic Website (or Service/App) could be considered a specialty in itself, and it can get pretty complex; Indexing, Caching, even designing the Database Structure and Code a special way. I put the terms slower and faster in quotes because everything is relative, and your mileage may vary. If you are using a framework (like Wordpress for example), then it's possible that someone already put some thought into optimizing the calls.
The first step is to measure and determine where the bottlenecks are. You may find out that you don't even need to worry about the Database (depending on your performance measurements). To get started, check out Google Chrome’s Developer Tools (Resource Analysis), or WebPageTest.org (just some examples of tools you can use). Good Luck!
I have experience with serving images, but I'd need more details to help you get closer to the problem. Can we get a url?
Have you configured entity tags (etags)? Are you compressing w/ gzip? How many dns lookups and http requests are being called? Have you added expires to headers? Are you scaling images in html?
These are just some of the "basics" for quicker loading. If seeing explosive growth than these basics aren't that significant.
Have you configured entity tags (etags)? Are you compressing w/ gzip? How many dns lookups and http requests are being called? Have you added expires to headers? Are you scaling images in html?
These are just some of the "basics" for quicker loading. If seeing explosive growth than these basics aren't that significant.
Fashom.com. I've only launched it a few days ago. The issue is login and page load time because of the number of images stored. I was also suggested that I could use cloud servers instead. Yes we are compressing w/gzip. We are not scaling images in HTML.
If you don't have tons of users/content then the problem isn't the server. If I had to guess its probably the sites architecture and code. If you want an inexpensive provider who uses SSD try Digital Ocean. They are dirt cheap and I've heard they are a solid provider, but I would look into the code first.
I third the sprites idea, that's where you should focus on the most if you haven't done so already since it decreases the total number of requests to the server and that's one of the big bottle-necks on the browser.
Measure. Until you measure end-to-end performance you have no idea what the bottlenecks are. Client side you can use something like Chrome inspector, server side you can use logging or a more sophisticated tool like New Relic.
Check out Google's advice: http://developers.google.com/speed/pagespeed/insights/
Checked that. One of the reasons is slow server response and I'm not sure if it's because of the applications or the server network speed. Server hosting company seems to think its the application