Automatically Update cdnjs Dependencies

Renovate can now keep cdnjs dependencies automatically up-to-date in web projects. Read on to learn more about how you can activate this feature.

Cloudflare throws down the challenge

I’ve been a loyal reader of the Cloudflare blog for a while now, but they really grabbed my attention recently when they wandered into Renovate territory with a blog post entitled “JavaScript Libraries Are Almost Never Updated Once Installed”.

Through some refreshingly quantitative analysis, the team at Cloudflare concluded that websites using outdated versions of cdnjs libraries rarely update them. This conclusion is drawn from their analysis that the volume of daily requests for outdated versions remains fairly unchanged over time, taking into consideration the general decay/deprecation of websites you’d expect on the internet (take note of the blue and red lines in particular, barely changed):

(Graph courtesy Cloudflare)

Cloudflare convinced me that there’s a segment of the internet using outdated dependencies. I needed no convincing to know that that’s a problem, so there was only one thing left for me to do.

Announcing automated cdnjs dependency updates

If you know Renovate, then you know that detecting and automatically updating dependencies is what we do. After already supporting such package managers as npm, Bundler, Go Modules, Dockerfiles, etc — adding cdnjs support was an easy step.

The first phase was to support cdnjs URLs “anywhere”. We did this in our new cdnurl manager within Renovate. It will detect a cdnjs URL anywhere in a matched file and then update it if necessary. Such functionality is good and useful, but we left it opt-in by default for an important reason: Subresource Integrity hashes.

If an HTML file referenced a cdnjs URL and included an integrity hash, then changing the version/URL without updating the integrity hash would likely cause that library to “break” — browsers would reject it. It was time to get more HTML-aware.

Announcing automated HTML dependency updates

The next step was to write an integrity-aware HTML manager for Renovate — one which could detect and update integrity hashes as well, if necessary. This was the missing step for successful cdnjs updates. When detecting and extracting cdnjs URLs, Renovate’s HTML manager can then extract any corresponding integrity hash, so that it can be updated too.

Conveniently, Cloudflare added SRI support to their API, saving us from having to calculate that manually. Here’s an example of the end result (which you should be familiar with if you’re an existing Renovate user, but might be a revelation if you’re not):

Pull Request with embedded release notes

HTML updated including both cdnjs URL and associated SRI hash

How to install

If you’re an existing user, this new HTML manager has already been released and enabled.

If you’re new to Renovate, the following are the easiest way to use it:

• If you’re using github.com, go to https://github.com/marketplace/renovate to install. Renovate is free for both public and private repositories. We recommend you “Select” dependencies first rather than All.
• If you’re using gitlab.com, log in at https://app.renovatebot.com and select which repositories to install Renovate into. You should get an onboarding PR within an hour.
• If you’re using self-hosted GitHub or GitLab, or Bitbucket or Azure DevOps, install Renovate’s open source CLI from https://github.com/renovatebot/renovate. It is distributed as a Docker Image for convenience — the “slim” one will do if you only need it for HTML.

Also, if you’re interested in getting started with HTML only (e.g. don’t want npm or Docker image updating too), then add this to your config: “enabledManagers”: [“html”]. That config will disable all managers that aren’t html.

If you have any questions, feel free to ask in our Config Help repository on GitHub.

What’s next?

We are waiting on Cloudflare to add support for sha384 and sha512 SRI hashes in their API. Once that’s done, we can adapt Renovate to maintain the same hash strength as is already present.

We also plan to add other CDNs to the cdnurl and html managers within Renovate, so that CDN users of any service can benefit from this dependency automation. We’re sure Cloudflare would approve, and thanks for bringing this use case to our attention!