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.
Prerequisites
Whoever says that coding is hard, just smack them.
Episodes
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
What to Do Next?
