Sujit Kumar Shah
Freelance PHP MySql programmer
How to make your website load fast?
The websites load faster is most important factors affecting its usability and make traffic in your website more and more... Today users are so lazy and they do want to wait for your website. Most of the Internet users will just skip a site altogether if it fails to load within a couple of seconds. Because of these problems you are losing visitors day by day.
Below you will find the summary of the "Website Load Faster" series. Those are simple yet effective ways to make sure that your website is running fast.
Minimize HTTP Requests
Most of the end-user response time is spent on the front end and this time is used in downloading images, style sheets (CSS), scripts, Flash, etc. so that HTTP requests is the most important key or guideline for improving website performance. Here are some techniques for reducing the number of HTTP requests.
- By combining all scripts into a single script, and similarly combining all CSS into a single style sheet.
- Combine your background images into a single image and use it as CSS background-image.
- Combine multiple images into a single image
Use a Content Delivery Network (CDN)
A content delivery network (CDN) is a collection of web servers distributed across multiple locations to deliver content more efficiently to users and it is used for improving download performance of website.
Add an Expires or a Cache-Control Header
There are two rules for Cache-control header one for static components: implement "Never expire" and another for dynamic components: use an appropriate Cache-Control header to help the browser with conditional requests.
Gzip Components
Gzip is the compression technique which is simple, effective way to save bandwidth and speed up your site.
Put Style Sheets at the Top
The HTML specification clearly states that style sheets are to be included in the HEAD of the page. Make all CSS in to single file and try to manage front end image from CSS.
Put Scripts at the Bottom
The bottom of documents are ideal locations for JavaScript. However, this is not always possible, depending on the functions in your scripts.
Avoid CSS Expressions
CSS expressions are a powerful (and dangerous) way to set CSS properties dynamically. To reduce number of CSS expressions use event handlers instead of CSS expressions.
Make JavaScript and CSS External
JavaScript and CSS files can be cached by the browser so using external files in the real world can produces faster pages. Inline JavaScript and CSS (like suggested on another rule above) get downloaded every time the HTML document is requested. This reduces the number of HTTP requests that are needed, but increases the size of the HTML document.
It really depends on the size and frequency of use of your css and javascript code. We opted to maintain them in separate files allowing for browser caching.
Reduce DNS Lookups
Reducing the number of DNS lookups cuts response times but increasing the number of parallel downloads can decrease response times. We've opted to use a couple of sub-domains increasing the number of requests but increasing the number of parallel downloads as you can see in the next point.
Minify JavaScript and CSS
By removing unnecessary characters from code we reduce its size and improve loading time. We’re currently using a packed version of the jQuery library. We will soon be moving to the minified version that takes more time to load but can be faster to read by the browser.
To compress the CSS (to some extension) we used CSSTidy.
Remove Duplicate Scripts & Style Sheet
A review of the ten top U.S. web sites shows that two of them contain a duplicated script as well as style sheet. Two main factors increase the odds of a script being duplicated in a single web page: team size and number of scripts. When it does happen, duplicate scripts hurt performance by creating unnecessary HTTP requests and wasted JavaScript execution. To avoid duplicate JavaScript and CSS file you must have to check in each page and remove it.
Using Sub domains for parallel downloads
Splitting components allows you to maximize parallel downloads. Make sure you're using not more than 2-4 domains because of the DNS lookup penalty. For example, you can host your HTML and dynamic content on www.example.org and split static components between static1.example.org and static2.example.org
Don't Scale Images in HTML
Don't use a bigger image than you need just because you can set the width and height in HTML. If you need
<img width="100" height="100" src="image1.jpg" alt="My image" />then your image (image1.jpg) should be 100x100px rather than a scaled down 500x500px image.
Avoid Redirects
No matter if you do a server-side header redirect, a JS redirect, or an HTML meta redirect, your site is going to load a header with a blank page, then load your new page, increasing the time it takes for a user to get to the actual page they want to go to - So completely avoid this at all costs.
Also you have to
- Configure Entity tags (ETags)
- Make Ajax Cacheable
- Flush the Buffer Early
- Use GET for AJAX Requests
- Optimize Images
- Reduce the Number of DOM Elements
- Minimize the Number of iframes
- Reduce Cookie Size
- Make favicon.ico Small and Cacheable
- Verify that Your Web Host is not Slow
- Use <Link> Instead of @import
- Optimize any Dynamic Scripts
- Optimize calls to Database
- Compress File Size: Server Site Script & Client Side Script
Tags: Make your website load faster, Best Practices for Speeding Up Your Web Site, Web Site Optimization
To do articles more effectively, we need your comments or suggestions on how to improve the articles and make it more useful, or what other articles you would like in the future. Please CLICK HERE and leave your feedback. Thanks!!!
- Ajax autocomplete using PHP & MySQL
- XML Web Service using PHP and SOAP
- Reduce High CPU usage overload problem caused by MySql
- Simple JQuery Accordion menu
- Pure CSS Bubble Tooltips
- Generating CAPTCHA Image Using PHP
- Pure JavaScript Search and Text Highlighting
- How to make your website load fast?
- Getting real IP address in PHP
- Basic security vulnerabilities in php code
Categories
Archives
Website Services
- » Web 2.0 Website Design
- » Online Shopping (E-commerce)
- » Content Management System
- » Small/Advanced Business Sites
- » Search Engine Optimization
- » Website Maintenance Services
- » Web and Enterprise Portal Development
- » Directory Website
- » Auction, Bidding Website
- » Classified, Marketplace Website
- » Web Application Development
