Site Speed & Code Bloat
As a web developer, it’s my job to find a balance between the overall speed of the site and it’s features. Yes in a perfect world you don’t have to make any sacrifices and you can provide all the best website features, and still have the fastest loading and interactive site on the planet.
One of the biggest boons to web development is also one of it’s performance problems. Libraries, Plug-ins, whatever you want to call them, in most you might actually use 10-15% of the code to get the feature you’re looking for, but your site loads the ENTIRE library, which takes time and directly affects your users experience.
The most important factor of your websites ranking on Google is how well your site performs in the eyes of your users. The speed in which your site loads and is interactive to them is HUGE. How much code they have to download and or execute determines that. Less code, Less DOM, Less bandwidth = faster to your users. Not everyone in the world has screaming fast internet, you have to keep that in mind, Google is grading you on an average across all users who visit your site.
So what do you? How do you fix it? Well that depends a lot on if you’re in control of the code. If you are, I’d say you should optimize it by seeing how much of it is actually being used on every page load and determine what can be removed or determine what can be optionally loaded based on that specific page. For instance, most homepages generally use more CSS styling than category pages, but you’re loading the same .CSS files on EVERY page load even though they’re not being used. Same with javascript and other site resources. Examine your pages and load the minimal resources per page. If you’re not using every single JQuery UI feature, why are you loading the entire library!?!? Go through and pick out the pieces you need. While you’ll likely never reach 100% code use, it’s a great target to aim for.
If you don’t own your codebase and are dependent on CMS’s like WordPress, Drupal, etc. or if you’re just not comfortable tweaking the code, then there are some things you can do to mitigated, but like most things if you can’t do it yourself it’ll cost you money. CDN services you can use like CloudFlare that will host those libraries so they have less distance to travel to your users, there are benefits and drawbacks to these services so you’ll definitely want to research and understand them.
Either way, you’ll want to make sure at least that your CSS and JavaScript is minimized, but ultimately you should regularly audit them both and make sure they’re being used, if not clean it up.
If your site design is creating many levels of nested elements, I recommend looking at ways you can decrease how many levels there are, as that greatly increases the size of the DOM and again will affect how quickly and often how “jittery” a page loads. Every element counts.
The key is to keep it simple, keep it small and make it usable and appealing. Often easier said than done.
There are many tools to use to see how your site is doing, the one I use most is Google Search Console and Lighthouse. If you need help understanding those tools or want to know what you can do to help your site. Reach out in the comments below or contact me directly.
Web Developer
eCommerce Usability Optimization Expert
PNW Native, Outdoor Enthusiast and Overlander.