Customer expectations for site performance are changing. Now 40% of customers say they will navigate away from a page if it takes 3 seconds or more to load, 46% of them will develop a negative perception of the company, and 64% will simply purchase from another online source.
Add to this Google’s recent announcement that Site Speeds are to be considered as factors for Search Engine rankings, and you’re probably beginning to worry about your website right now.
The Challenges of Today’s Websites:
- Content-rich Internet Applications are Increasing: At the same time as demand for faster page load time is increasing, so is the demand for more engaging functionality and content –rich Internet applications such as price sliders or search and category results that re-sort on the fly. This creates a challenge for online companies. Adding content increases page weight and impacts response time. Web page size has more than tripled in the last 5 years.
- Performance Issues Multiply With Distance: The farther visitors are from the data center where the site is hosted, the more response times degrade. Your site’s performance may be 2 seconds at the data center in Atlanta, but 3 seconds on the opposite coast, and even longer for international visitors. Traffic spikes can also slow down your site and response times can spike as high as 50 seconds during the holiday season.
What to Bear in Mind When Developing a Website:
- Apply the 80/20 rule to page loads when optimizing for speed: Only 20% of the loading time will be spent loading HTML. So the dynamic HTML content isn’t usually the problem, it’s the rest of your UI which takes 5 seconds to download and render on the users browser.
- Design Web Pages with performance in mind: You need to minimize connections and minimize data transfer (file size). Do this by reducing object counts, compressing images and text, and caching properly.
- Minimize HTTP requests: Reducing connections as much as possible has shown the most performance improvement with the least changes. Combine your JS and CSS files and keep the image count to a minimum. If you need to load a lot of images for style, use a CSS image sprite.
- Use HTTPS/SSL only where necessary: Restrict SSL only to data sensitive areas of your site such as the checkout.
- Create smaller JS/CSS files: Remove spaces and unwanted semicolons from your JavaScript to reduce transfer time. Use a tool to compress JS/CSS for production pages.
- Put JavaScript Includes at the bottom: If the JS is not needed for immediate use, put the include tags at the bottom. Scripts at the end of the HTML allow maximized concurrent downloads and the page can render while the JavaScript finishes.
- Use Cache Control Headers: Properly caching a page at the browser level can significantly reduce load times. It also helps with subsequent page load times if content is shared (same JS/CSS files).
- Avoid HTTP 302 redirects: They slow things down, and people don't like them.
- Use multiple static content servers: If the servers have different domain names the browser will make additional parallel connections to those servers and download more content concurrently.
- Use Gzip compression for page responses. Gzip compresses the HTML response at the server and sends it back to the browser, which will then do the decompression. There is more CPU overhead but quicker transfers are typically a better trade-off.
0 comments:
Post a Comment