Tips for Website Performance Optimization

1. Reduce HTTP Requests#

When your browser fetches data from a server it does so using HTTP (Hypertext Transfer Protocol). It is a request/response between a client and a host. In general the more HTTP requests your web page makes the slower it will load.
There are many ways you can reduce the number of requests such as:
  • Inline your Javascript (only if it is very small)
  • Using CSS Sprites
  • Reducing assets such as 3rd party plugins that make a large number of external requests
  • Don’t use 3rd party frameworks unless they are absolutely needed
  • Use less code!
  • Combining your CSS and JS files (with HTTP/2 concatenation is no longer as important)

2. Minify CSS and Javascript

3. Reduce Latency with a Content Delivery Network (CDN)

4. Caching
- Browser Cache
- Server Cache
- Caching HTTP reverse proxy

5. Enable Gzip Compression

6. Serve Scaled Images

You should always upload your images at scale and not rely on CSS to size them down. If you do you will run into this little Google Pagespeed recommendation: “Optimization suggestion: “By compressing and adjusting the size of … you can save 5.8 KB (51%).
This recommendation refers to your images being scaled down by your browser. For example, maybe the image you upload has a 400px width, but the column it was placed in is only 300px wide. This results in your image being scaled down to 300px due to CSS so that it matches the column size. It is better to always upload images at scale and also upload multiple resolutions of your images and serve the right resolution for the right device.

7. Database Optimization
Cleaning out old unused tables or creating indexes for faster access there are always things that can be optimized.
MySQL Tuning

#

Optimizing MySQL is also very important. Unfortunately this is very specific to your environment and your setup so we can’t provide recommended configurations. The MySQL/MariaDB configuration file is normally located in /etc/my.cnf. Here are a few settings though to keep an eye on.

  • tmp_table_size
  • query_cache_type
  • query_cache_size
  • query_cache_size
  • join_buffer_size
  • max_heap_table_size


tools for web performance optimization

#

#
  • PageSpeed
    Google PageSpeed Insights grades both the desktop and mobile site speeds. This popular testing tool analyzes some of the most important website components; JavaScript, CSS, and Image performance.
  • GTMetrix
    GTMetrix offers a variety of reporting options. GTmetrix goes into great detail as it checks both PageSpeed and YSlow metrics, assigning your site a grade from F to A. 



Comments