I'd like to know how to increase the page upload time by compressing the images on my site, including the exit pop up gif?
Loading time is about 5 seconds.
It was built by WP.
How to fix this issue?
Please, tell me the way.
Thanks.
Your image files are likely too large. This is probably because your images have a very high resolution and/or are too large.
If you only need an image to be, say 400 x 500 pixels and your actual image is 1600 x 2000 pixels, you have an unnecessarily large image that will slow down your load time. You can reduce image size right in WordPress using their image editor.
You can also use tools like Photoshop to compress images so that they are smaller files and more web-friendly. Use Photoshop's "save for web" feature and reduce the image quality.
More detailed answers here.
Related
I know reducing your requests to the server will help reduce load time. Placing all of your images into a sprite can really help with this. However, when is a sprite too big?
The sprite for my page is 1.7mb! I thought about splitting the sprite up into smaller sprites. That will increase server requests and would seem to be a pointless task.
My site loads too slow and I’m trying to pinpoint the slow downs.
Can anyone suggest how should I handle one big sprite? should I break it into multiple files or is there any other suggestion to improve the page load time.
The best size is 4096 x 4096 What is the maximum sprite sheet size I can use for android devices?
So long as you are using fewer pixels than that, you should be fine. The only logical reason to break up your sprite images smaller than that is if you want to give the user an image to look at while they wait for the others to load. (Or if there are some images you know some users will never see on their visit.) But it will increase the loading time overall.
As for file size, add compression to your personal taste. If your hatred of the loading time and your hatred of the compression artefacts are equal, you have found the right balance.
My site is taking a long time to load. It is quite resource intensive but upon checking a waterfall of the site load I have two images that take a very long time to load.
http://www.webpagetest.org/result/170919_0K_df1a409e4603bc6459c19cc03cc19aea/2/details/#waterfall_view_step1
I have scaled the images in the WP media image editor so that they are a reasonable size but the waterfall still shows long load times on those images?
www.linestar.ca
Any insights are appreciated!
Though you resized the image in wp, that doesn't really change the file size. I downloaded your dark banner photo and it was 12.8mb. That's huge and takes a long time to load. Try and get your images around 500kb or less. It should still be pretty clear at 200kb even. It will still have decent quality at those levels. Your image size is also huge, at 1920X3000. Definitely doesn't need to be that large. Check out this link for a rough idea of sizing: Image sizing for background images
I've tried to decrease the size/quality of my background picture, but still it loads rather slowly.
I often visit sites that have much higher quality backgrounds that load instantly
my site: http://staging.tabler.io/
How can I speed it up?
Your image is 1.1 MB so, contrary to the filename, it's not optimized. Save it as a smaller file and/or optimize it with an app.
Also remember that the browser will cache the image.
I know you can reduce page load time by using CSS sprite. As this will reduce round trip, etc.
Is their any numerical value or performance test that by using CSS sprite how much average page loading time you can save. I know this will depend on the site. I am interested to know about a general data for e commerce site like Amazon.com
Besides, if you use async image loading like JAIL how much time you could save. I know u can't load everything asynchronously.
Having a large sprite, versus a small image, the large sprite isn't that much bigger in file size than the small image, assuming you line your images in the sprite horizontally like your supposed to.
Most browsers will do about 6 simultaneous downloads at once. So a general rule of thumb is, if you have more than 6 icons, or theme graphics, it should be sprited. If you have photos or illustrations, they should not be sprited.
Improper usage of sprites will lead to overload server. Sprites are used to reduce the number of server requests, but large srpites of jpg format can be bad.
It is like balance either all smaller images of less size or a sprite that i of smaller size that covers more images
http://coding.smashingmagazine.com/2010/03/26/css-sprites-useful-technique-or-potential-nuisance/
The page loading can reduce upto 10X factor when they are use
optimally!!
Hope this helps
Currently I am using a image sprite having size of 200K and its load time is 4.9 second.
My Question is,
Does the sprite image size matters while loading?
If the size is increasing, Can we break it in to two or three image sprite?
What would be the best option increasing the HTTP request or doing some compression?
Thanks
It matters if you want certain images to show up before others. Obviously no images can be shown until the whole thing loads. If there are elements of particular importance then break them into a separate file.
Yes
Compression won't get you very much because you are probably already using a compressed image format like jpeg or png.
If you need to optimize page load speed I would do my suggestion in point one and possibly use async requests for remaining images.