In Part 2 of the Better Asset Versioning series, let’s dive into how to remove the query strings, i.e. the
?ver=1.0.0 from the static resources. Static resources are the scripts, fonts, styles that we enqueue. When you run speed tests on sites like Pingdom, a common ding to the performance score is this very topic. Let’s build a plugin that removes the query string and places it inline as part of the static URL.
This hands-on lab is part 2 of the Better Asset Versioning series. In Part 1, you learned about asset versioning and then automated it. We continue that process to build a plugin utility. Then you’ll dive into query strings and how to convert them from a query string into part of the static URL. You are going to build a custom plugin to handle this task. Let’s get started.
Want to see the plugin that you’ll be building in this lab? Click here to view it on GitHub .
What You Will Learn
This lab is packed full of WordPress, HTML, and PHP goodness. You’ll learn:
- Why WordPress appends the version number on the static URL of scripts and stylesheets.
- Why we need to assign version numbers when enqueuing a script or stylesheet
- How we can leverage cache busting to make sure the latest version of a script or stylesheet is delivered to each returning visitor’s browser.
- Different strategies to leverage cache busting.
- Why you should NEVER just strip off the version’s URL query string without one of these strategies.
Then we’ll build a plugin together that:
- Strips off the version’s URL query string.
- Moves the version number into the static URL.
- Deal with URLs that already have the version number within the URL.
- Allow for configurable exceptions.
- Provide the asset versioning off of the file’s modification time within this plugin.
Why build this plugin with me?
There are gists and plugins, such as WP Rocket, available that you could put into your project right now without having to build this plugin with me. So why would you do this lab? Why?
- To learn and improve your plugin, OOP, and PHP skills.
- To learn more about HTTP and WordPress.
- To build your problem-solving and programmatic thought processes.
Mastering this profession requires constant building and learning. I hope you’ll build this plugin with me.
If you listen carefully, you can hear the 1s and 0s flowing in your computer.
Total Lab Runtime: 03:18:22
- 1 Lab Introductionfree 09:30
- 2 What is a URL Query String?free 14:36
- 3 The Intent of ?ver=1.0.0free 12:22
- 4 Understanding the Problemfree 14:01
- 5 Cache Busting Strategiesfree 09:57
- 6 Planning Our Pluginpro 18:17
- 7 Versioning Utility Helper Filepro 08:36
- 8 Start the URL Converter Classpro 18:11
- 9 Hook into WordPresspro 11:57
- 10 Regex or Parse the URL?pro 12:30
- 11 Convert with Regexpro 06:10
- 12 Apache and Nginx Rewrite Rulespro 10:43
- 13 Deciding Whether to Convertpro 07:35
- 14 Skip When No Version Query Stringpro 09:18
- 15 Only the Local Assetspro 14:09
- 16 Improving Our Code & Readabilitypro 11:52
- 17 Test, Fine-Tune, and Wrap it Uppro 08:38
Assets, i.e. scripts, styles, and fonts, need a version number in order for them to bust through the web hosting cache and for users to receive the latest file(s). In this series of hands-on labs, we’ll take a look at versioning. Then we’ll dive into better asset versioning techniques to eliminate redundancy and manual processes, automate the versioning, improve your build efficiency, and take care of the ding we get on website speed testing sites, such as Pingdom. The Prerequisites Let’s get you ready to do this series to ensure you get the most out of it. The Series Hands-on […]
Check out the WordPress Fundamentals Library for more hands-on labs, insights, Docx, and more.
Check out the series page for more labs: Better Resource (Asset) Versioning Series