State of Site Speed Performance at Upwork in 2021

January 12, 2022

9 min read

For some time, Upwork has focused on site speed performance to provide fast, interactive experiences for users. This post highlights our site speed improvement efforts by establishing better culture, processes, and tools.

Site speed has real business impact to any technology business and is no longer a debated topic among leading software vendors:

At eBay, speed was a company-wide initiative in 2019. Product teams were determined to make the site and apps as fast as possible for users. For every 100 milliseconds improvement in search page loading time, eBay saw a 0.5 percent increase in Add to Cart count.
Yelp reduced First Contentful Paint (75th percentile) by 45 percent, Yelp Page Complete (75th percentile) by 25 percent, and saw a 15 percent improvement in their conversion rate.
Vodafone improved their Largest Contentful Paint (LCP) by 31 percent, resulting in an 8 percent increase in sales, a 15 percent increase in their lead to visit rate, and an 11 percent increase in their Cart to Visit rate.

More studies are available on WPOStats.

Establish a site speed performance culture

As a global business, Upwork needed to do a better job prioritizing site speed performance. The goal was to organize engineering teams to improve speed and sustain it moving forward.

A new SPEED team was formed and three frontend engineers joined the team, all of whom were interested and dedicated to improve site speed performance. Three strategic pillars of work were identified:

Pillar 1: Measurement and monitoring
Pillar 2: Exploring, testing, documenting, and sharing best practices, patterns, and trends
Pillar 3: Influencing the entire organization by partnering with teams

Pillar 1: Measurement and monitoring site performance

“You cannot improve something you cannot measure.”

Upwork prioritized the goal to consistently measure site speed performance. Early on, an agreement was made among stakeholders on what metrics, tools, and principles to use.

By using Real User Metrics (RUM) as a performance-based field approach, Primarily Core Web Vitals were prioritized to measure and optimize:

Following Google’s recommendations, Upwork’s site performance for each Core Web Vital is reported as either:

Red: Poor performance
Yellow: Performance needs improvement
Green: Performance is good enough

This is shown in the diagram below:

How performance is measured

Upwork adopted Perfume.js as part of the performance monitoring library to be used across all Upwork site pages. This software measures and collects Web Vitals using Real User Metrics (RUM) along with the ability to also track the following:

All other Core Web Vitals
Environmental info about visitor location, device, platform, browser, and connection speed
Additional contexts such as first versus repeated page load, visitor versus user, and web versus native

Presenting the results

Once Primarily Web Vitals are collected, the information needs to be presented in a visually straightforward and consistent way. The entire organization required a simple UI Interface to gain insights for every page, for teams, and for business pages. The UI also needed filtering capabilities to allow picking intervals and offsets, switching between Primarily and other Core Web Vitals, and by visitor contexts:

Enforcing and maintaining performance

To make sure teams treat speed performance goals seriously, we introduced Speed Performance Budgets. Each team gets assigned service-level objectives (SLOs) for their owned pages. The requirement is to prioritize site speed work until the moment SLO is achieved and page Primarily Web Vitals have green status. After that, monitoring performance metrics on a regular basis may be all that is required.

How often should reporting take place?

The SPEED team is responsible for aggregating site-wide Primarily Web Vitals into weekly objectives and key results (OKR) reports for the leadership team. These regular status updates assure that the company treats site speed as a priority.

Individual teams also track and report on Primarily Web Vitals for their owned pages. Until SLOs are reached, teams must prioritize specific initiatives to improve underperforming pages as a quarterly goal.

Pillar 2: Exploring, testing, documenting and sharing best practices, patterns, and trends

On a daily basis, SPEED team examines the latest trends in site performance. Different optimization techniques and patterns are performed. The results are measured against metrics. The team closely collaborates with the frontend platform team to adopt any performance improvements to the frontend core framework.

In order to better share knowledge around SPEED performance, An internal wiki dedicated to performance has been set up to share knowledge regarding speed performance. It includes playbooks with best practices and how-to articles containing practical guidelines to approach and tackle Web Vitals.

Our senior engineer, Alexandr Guc, gave a presentation about site speed at the most recent Upwork Frontend Summit. The feedback was overwhelmingly positive proving the importance of site speed to Upwork staff members and partners.

Pillar 3: Influencing the entire organization by partnering with teams

To impact a large technology organization, the SPEED team needed to collaborate in an efficient manner with other teams. There are several ways this was accomplished.

Creation of the Speed Performance Guild

To scale ourselves and reach every team within Upwork, we organized a Speed Performance Guild and asked every team to delegate experienced frontend engineers to improve their own site performance. They represent their teams on a regular basis, attend weekly sync meetings, participate in discussions and brainstorms, and bring best practices back to their teams. The adoption of the Speed Performance Guild within Upwork has been overwhelming.

Engage in regular site performance audits

The SPEED team acts as a service team by being approachable and helpful. We host regular audit meetings, where any team can come and inspect owned page performance and identify ways to improve. The goal is that participants should leave the meeting with enough insights and a clear plan to improve site performance.

Adopt pre-production monitoring as a best practice

Pre-production site speed monitoring is another technique which has become a cornerstone of Upwork’s software development lifecycle (SDLC). Teams are expected to maintain their pages performance with every new product release.

Discovering degradation after a production post-release is too late and extremely inefficient to correct. In addition, there is a risk of it becoming a customer satisfaction issue. Instead, the aim is to detect and highlight slowdowns in any Web Vital metrics before merging pull requests.

A RUM approach, highlighted in the “Pillar 1” section, that measures page performance cannot be used since there are no actual customers “hitting the branch” with code changes yet. Instead, Upwork has built an in-house hosted web page test solution and has adopted it as part of its continuous integration/continuous delivery (CI/CD) pipeline.

In summary

Site speed Improvements in 2021

As a result of our efforts, Upwork.com has enjoyed a significant site-wide speed improvements on all of our primarily metrics:

LCP improved by 27 percent from 3.96 down to 2.91 seconds. While staying in the yellow zone we are now much closer to green.
FID improved by 33 percent (from 146 down to 98 ms) which is now considered in the green zone.
CLS improved by 67 percent (from 0.21 down to 0.07) and is in the green zone as well

Throughout the year, the SPEED team collaborated the closest with our acquisition and project catalog teams to achieve the following results:

The acquisition team managed to move most of the owned pages’ Primarily Web Vitals from yellow/red in the beginning of the year to green zone.
The project catalog team has improved LCP from red to crossing into the yellow or green zones. (FID improvements will be reported after the end of 2021.)
While other teams have been joining the Speed Performance Guild and ramping up, 2022 should be a breakthrough year in improving site and app performance.

The impact to the business

Due to the iterative nature of site speed improvements, it can be a challenge to objectively measure business impact. To date, the following enhancements have been identified:

Significant LCP and FID improvement for the Talent Search page resulted in 4 percent increase in Job Post rate and 6 percent increase in Invite to Job rate metric.
Time To First Byte (TTFB) improvement across the site for slower connections resulted in a site traffic increase of 3.6 percent overnight while mobile traffic increased by 5.5 percent. This was achieved by replacing SSL certificate type from EV (Extended Validation security process for SSL encryption requiring OCSP requests) to OV (Organization Validation). This is shown in the figure below.

Future plans in 2022

Inspired by the progress made, Upwork is looking forward to 2022 being the year for continued site speed improvements. Specific performance priorities include the following:

Migrate Vue.js and Nuxt.js from v2 to v3 for all site pages
Improve SinglePageApplication pages performance by pushing static HTML app shell to the edge using advanced server and browser caching techniques
Site topmost navigation becomes a separate application independent of the Nuxt application
Improve native app screen load time
Launch measurement and SLAs to Backend microservices
Roll out measurement for Upwork client and freelancer native app screens
Automate site speed monitoring, performance degradation detection, and alerts
Enforce Speed Perf SLOs across all engineering teams
Introduce the Lighthouse score as a rule-based measurement in addition to performance-based RUM Web Vitals
Evaluate and pilot server-side GTM approach for managing third-party scripts

It is our plan to continue reporting speed performance updates at the end of every year.