Keeping up with Google Chrome updates is crucial. After all, 63.56% of Internet users have used Google Chrome worldwide. (Statista) So, if a new Chrome update makes a web page faster, a developer’s life easier and the user experience better, you must be at the forefront of all of it.
This is one of those updates.
On August 29, 2023, the Google Chrome team released the origin trials for scheduler.yield, an experimental feature allowing faster loading times and improving page experience. This aims to replace an old yielding strategy using setTimeout and solve the problem of task backlogging.
Here’s what we’ll discuss:
• The Problem of Long Tasks
• Introducing Scheduler.Yield
◦ Why Not Just setTimeout?
• Should You Try It?
• 3 Ways Scheduler.Yield Improves Your SEO
◦ 1. Enhanced User Interaction and Experience
◦ 2. Reduced Risk of Page Crashes
◦ 3. Forward Compatibility
• Conclusion
Let’s start.
The Problem of Long Tasks
Web developers know the frustrations of dealing with “long tasks” – a JavaScript that monopolizes the main thread and slows down the whole web page. And if you have too many long tasks, a core web vital metric is affected.
Called the Interaction to Next Paint (INP), this metric will replace the First Input Delay (FID) by March 2024 and “assesses a page’s overall responsiveness to user interactions,” such as:
• Clicks
• Taps
• Keyboard Interactions
Long tasks make these interactions slower since users must wait for the page to load before doing anything. So, if your page has lower interactions, you’ll score less in this core web vital metric.
A traditional yielding strategy uses setTimeout with a value of 0, which separates the task and schedules it for the subsequent execution. This means it will be set back at the end of the queue at the soonest possible time but still compete with other tasks from other sources.
Image from Google Developers
While setTimeout is an excellent website optimization tool. As your page runs multiple tasks, users risk facing slower and slower page speeds due to piling tasks in the main thread.
Introducing Scheduler.Yield
To solve the tasking issue, Google created scheduler.yield, essentially the website optimization tool that replaces setTimeout for yielding tasks.
Unlike the old yielding strategy, scheduler.yield doesn’t bring the remaining work at the back of the queue. Instead, this new Chrome update maintains them in front, so no work gets delayed.
Let’s take a look at how these two tech innovations compare to each other, as illustrated by Google:
Image 1 shows setTimeout’s yielding behavior, sending the remaining work at the “end of task queue” and letting it compete with other work.
Image 2 shows scheduler.yield’s yielding behavior, maintaining the work right in front of the queue and improving page responsiveness.
As you can see, while both tasks improve page load time, setTimeout’s yielding strategy allows non-user interaction work to enter the main thread. Consequently, your page becomes sluggish as it juggles more tasks, negatively impacting your INP metric.
Enjoy the benefits of this Chrome update by:
1. Entering chrome://flags into your search bar.
2. Enabling Experimental Web Platform Features.
3. Relaunching your Chrome browser to enable the feature.
But Why Not Just setTimeout?
This is a question most people would ask now that the origin trials for scheduler.yield are starting – why use it on your website despite a setTimeout to 0 that already works?
For starters, setTimeout isn’t explicitly designed for yielding. Instead, it’s just a nice side-effect that developers exploit to optimize a site’s user interaction. The Chrome team realized they needed to create new tech innovations to specifically improve page load time, which is why scheduler.yield was made.
Aside from its specific use case, scheduler.yield also improves your INP metric. Unlike other Google Chrome updates, scheduler.yield is released in anticipation of INP. This means that if you don’t have scheduler.yield in your scheduler API by March 2024, then you risk scoring low in that core web vital.
So, Should You Try It?
If you want to increase user engagement, we suggest you do. However, you still have to deal with an initial limitation most tech innovations face: lack of compatibility. Not all browsers support scheduler.yield yet, so you have to do either of these items first:
- Setup scheduler.polyfill as a fallback: This is great if you’re already using scheduler.yield but still want to set tasks and yielding priorities through the TaskController, self.scheduler and TaskPriorityChangeEvent. (Access the polyfill here.)
- Roll your own fallback: You can use two scripts to do this. (Google Developers)
Any search engine optimization or SEO service provider and page speed optimization service will surely use scheduler.yield as a website optimization tool. This is because Core Web Vitals allow pages to rank higher in search results for their perceived superior page experiences. And since scheduler.yield makes faster loading times possible, there’s no reason you shouldn’t try it out.
3 Ways Scheduler.Yield Improves Your SEO
If you’re a local SEO service provider or an internal web developer, scheduler.yield presents several benefits for your web page (and life). Here are three ways it can do that:
1. Enhanced User Interaction and Experience
Long tasks are a primary pain point for many websites since even the most granular delays significantly impact your ranking. According to Google, long tasks “occur due to complex work that takes longer than 50 ms.”
Image from web.dev visualizing long tasks (long, yellow blocks) and short tasks (short, yellow blocks). Long tasks have red flags to help developers identify which tasks are causing delays.
Now imagine that 50 milliseconds (or more) are chopped up in multiple, shorter works and queued at the back of your main thread. This causes inconsistencies in your UI and UX, and Google’s INP can detect that.
Scheduler.yield prevents these inconsistencies by maintaining the long task in front of the queue after chopping it up in blocks. This behavior prevents other work from entering ahead of the queue, minimizing delays in user engagement and reducing bounce rates.
2. Reduced Risk of Page Crashes
“Page crash” – a familiar term that owners utter when seeking aid from a page optimization service. SetTimeout to 0 was the most effective technical SEO solution in the past.
However, as websites become more complex and tasks pile up, page crashes will occur more often, especially if website hosting and other elements (such as structured markups, image sizes and fonts) are not correctly optimized.
Since scheduler.yield can improve page load time by letting the long task finish in its entirety, page speed optimization service providers are likely to use it to replace traditional yielding strategies.
3. Forward Compatibility
We can’t stress this enough. You need scheduler.yield to future-proof your websites and improve user engagement.
Sure, these Google Chrome updates are not yet supported by other browsers. However, Chromium-based browsers like Firefox, Edge and Opera will likely support this in their scheduler API since they share the open-source framework that Google Chrome runs on.
Screenshot from mdn web docs showing the current browser compatibility of Interaction to Next Paint metric for desktops and mobile devices.
Also, since FID will be phased out by March 2024, setTimeout becomes less effective in simulating faster loading speeds. To solve this, you’ll need scheduler.yield to prioritize loading long tasks and simulate faster user interactions for INP.
Keep Tabs on Google Updates With Thrive
This is an exciting time for website owners and developers. You no longer have to settle for side-effect yielding since you finally have an actual script that yields tasks by design.
And if you need someone who knows their way around these updates, why not check out Thrive?
We’re an SEO service provider that’s on the lookout for emerging web development and digital marketing trends for our clients. But we don’t stop there – we share all our knowledge through the Thrive blog so you won’t be left in the dark, even if you’re not working with us.
But if you’re searching for a page speed optimization service with proven results, we’re just one call away. Dial (866) 908-4748 or send us an email here.
Let us keep your website “up to speed” with new features and best practices today!
