Web Performance: Why it Matters
Published: 2019-07-26 12:44:04

{% youtube BWsHP4E1Nx0 %}

*This article was taken from a This Dot Labs Podcast on Web Performance with Rob Ocel, Tracy Lee, James Spivey and Jarrod Overson who is a Director at Shape Security.*

A few years ago, I worked for an online retail company as an Operations Engineer. One of my roles there was to improve processes for the various operations that took place in the warehouse. In order to do so, I worked closely with the associates in their respective processes to gain insight into what the associate needed to effectively and efficiently perform their job functions. So what exactly does this have to do with web performance? Since leaving my role as an Operations Engineer, I’ve come to the realization that web developers are often tasked with the same responsibility when it comes to building web applications. In each case, a positive user experience is the ultimate goal.

Oftentimes when we hear the term web performance, we only think about how fast the page loads on our web application and minimizing the bundle size. While web performance encompasses both aspects, user experience should not be overlooked; it should not be an afterthought. That’s because user experience is arguably the most important aspect of web performance. “If we focus on the user experience first[…], we end up adding a lot more value [to our app] with a lot less effort.” (Jarrod Overson) 

Jarrod Overson, who spoke on the This Dot Labs Podcast about web performance, used to work in the video game industry. He stated that sound played a vital role in making the user feel that their actions were meaningful when they performed a specific task within the game. Sound served as a way to give feedback to the user that something was happening. On the contrary, sound is viewed as something that should be avoided when it comes to web applications. Therefore, different tactics have to be deployed in order to provide that same type of feedback to users.

In the same podcast, James Spivey introduced the topic of ghosting. Social media sites, such as Facebook and Twitter, use “ghost elements” as a means of delivering a positive user experience. Ghosting is a way to display “temporary” content on an app while the actual content is being loaded. It pretty much serves as a filler piece.

When it comes to web performance, the needs of the developer are not always the same as the needs of the user. Therefore, simply assuming the needs of the user can result in a poor user experience. That’s why it’s important for us to know what our user wants. For instance, when a tweet is liked on Twitter, it optimistically updates the state. That means the user is able to see the liked tweet although it has not been updated to the server. If, for some reason, the server fails and the page is refreshed, the tweet will no longer be liked. As a developer, it may make more sense to pessimistically update the state to prevent this from occurring. However, as a user of the app, it may make more sense to experience the instant gratification of seeing the tweet being liked once the like button is clicked.

In short, user experience as a part of web performance matters. Below are links to several tools available to us to test our sites on web performance:

[Lighthouse](https://developers.google.com/web/tools/lighthouse/)

[WebHint](https://webhint.io/)

*This article was written by Ansara Hooks who is a freelance writer.*   

*Need JavaScript consulting, mentoring, or training help? Check out our list of services at [This Dot Labs](https://thisdot.co).*