Page Speed Project

Page speed is how quickly your page loads.

Page speed is commonly mistaken with "site speed," which is a site's average page speed. Page speed is measured in "page load time" or "time to first byte" (how long it takes for your browser to receive the first byte of information from the webserver).

Google PageSpeed Insights measures page speed. PageSpeed Insights Speed Score uses CrUX (Chrome User Experience Report) data and reports on FCP and DOMContentLoaded (DCL). Project site - www.slots.academy 

 

SEO tips

Google's algorithm uses site speed (and page speed) to rank pages. Research suggests Google measures page speed by time to first byte. Slow page performance implies search engines can crawl fewer pages with their crawl budget, which can hurt indexing.

Page speed affects UX. Longer load times cause higher bounce rates and less time on page. Longer load delays hurt conversions.

Some strategies to reduce page load time:

Compress

Gzip compresses CSS, HTML, and JavaScript files greater than 150 bytes.

Image files shouldn't be gzipped. Compress them in Photoshop to maintain image quality. Optimize images.

Minimize HTML, CSS, and JavaScript

By optimizing your code (including removing unneeded characters), you can boost page speed. Remove unused code, code comments, and formatting. CSSNano and UglifyJS are Google recommendations. www.spill.media 

Redirect less

Each page redirect adds time to the HTTP request-response cycle. Example mobile redirect pattern:

example.com -> www.example.com -> m.example.com -> m.example.com/home...each redirect slows page load.

Unblock JavaScript

Before rendering a page, browsers generate a DOM tree from HTML. Your browser must stop and execute a script before continuing.

Google recommends limiting JavaScript blocking.

Use caching

When a visitor returns to your site, the browser doesn't have to reload the full page (stylesheets, graphics, JavaScript files, etc.). Check if your cache has an expiration date with YSlow. Set your "expires" header to specify how long to cache the content. Unless your site design changes often, a year is usually sufficient. Google explains caching here.

Accelerate server response

Traffic, page resources, server software, and hosting affect server response time. Look for bottlenecks like sluggish database queries, delayed routing, or insufficient RAM to enhance server response time. Under 200ms is ideal server response time. Optimize time-to-first-byte.

Cdn it!

CDNs are networks of servers that deliver content. Multiple, geographically diversified data centers keep copies of your site so users may access it faster and more reliably.

Image-optimize

Make sure your images are the proper size, file type (PNGs are ideal for graphics with fewer than 16 colors, JPEGs for photos), and compressed for the web.

Create a template for buttons and icons using CSS sprites. CSS sprites combine images into one huge image that loads all at once (reducing HTTP requests) and displays only the areas you desire. By not loading several photos, you save load time.