Website speed optimization is one of the most important exercises in Technical SEO which is very nuanced for several reasons.
A. It’s not a ranking factor
B. A lot of folks find it a waste of time
C. Hence it often doesn’t get the budgeting or prioritization that it deserves
Now there are loads of things you can do to uplift your web performance. Just enlisting a few things
- Fetch Priority High
- Lazy Load
- Image decoding async
- Preloading
& the list goes on
And this is where it gets tricky before you initiate any project you need to know whether this will actually improve the metrics or not.
Sometimes you may implement a thing but then you will find out that the browser is able to handle that so maybe you shouldn’t have done it or maybe the client is sceptical whether the developer budgeting needs to go for it or not.
We have all been there & this is the objective of this post.
In this post I will explain how you can build dummy pages on Visual Studio Code & test it on VS Code’s LIVE Server & test things in isolation to gauge the impact on metrics.
Two key things you will learn
- Building replica web pages with & without single feature whose web performance metrics can be measured
- Proving the value of single variable based change in the code (you don’t even have to look for competitor reference to prove your point)
Step 1: Build Code for the Dummy Page Version 1
In this step, we simply build a dummy web page using AI (we can call it vibe coding if that helps this page for secondary keywords XD)
Step 2: Install Live Server Extension of VS Code
Step 3: Clone the same page with one change at a time
If you see the above screenshot, you can see the same page cloned one, where I have added image decoding async & one where that is not the case. This allows me to gauge the impact of that one feature alone.
<img src="stars.jpg" alt="${product.name}" loading="lazy" decoding="async">
Now comes the exciting part of measuring the impact in isolation 😃
With Async
Without Async
| Metric | With decoding="async" | Without decoding="async" |
|---|---|---|
| LCP | 0.18s | 0.19s |
| Scripting | 23ms | 154ms |
| Rendering | 101ms | 124ms |
| Loading | 6ms | 9ms |
There is a slight improvement in metrics & more importantly there is no decline in performance metrics which gives more condidence to move ahead with isolated features.
Kunjal Chawhan founder of Decode Digital Market, a Digital Marketer by profession, and a Digital Marketing Niche Blogger by passion, here to share my knowledge