John Paul Davis

CARE had an existing website built in WordPress, using the Advanced Custom Fields plugin and Timber to componetize the site into Twig components. After several years, tech debt had accrued, and the site’s Core Web Vitals scores were suffering. Notably, the original site relied on jQuery and many jQuery plugins, and other JS frameworks (Greensock and D3 both for animations), as well as relying on many WordPress plugins to provide functionality that each loaded their own JS. The site also loads numerous third-party Javascripts to do things like load tracking pixels. CARE wanted a design refresh of all components.

I took the opportunity to pitch an overhaul of the Javascript, CSS and plugin usage. Since every component was already going to be refactored, meaning a massive QA of the entire site for regressions and new bugs, it made sense to also handle the aforementioned tech debt. CARE agreed.

Under my direction, a team of domestic and offshore developers performed both the reskinning and the code refactor, resulting in a much-improved Core Web Vitals score. This was accomplished by removing jQuery, rewriting all Javascript to use vanilla Javascript, removing uneeded WordPress plugins, condtionally loading plugin assets only on pages in which the plugin was in use, moving to bespoke solutions built in PHP, refactoring animations to be governed by CSS instead of Javascript, refactoring HTML to use semantic HTML tags, ARIA attributes, and reducing “div soup,” leveraging the edge cache layer to transform legacy images from JPEG/PNG to newer, more performative formats like WebP and AVIF. While not perfect, due to the many third-party scripts that, for business reasons could not be pared down, the CWV score saw double-digit improvements in each metric, and most importabtly, the page performance increased dramatically in user testing.