8 min read

Front-End Engineers Are Expensive, but They're Worth It

Chinese translation by 安翔, 郭芮 @ CSDN

I still remember my first paid software gig in 2008. I got $25 an hour to build a WordPress website for a local small business. I was thrilled someone would pay me to work on my hobby, and I used the windfall to buy my first camera.

Fast forward to 2018. In the San Francisco Bay Area, it’s common for a junior front-end engineer who recently graduated to have a 6-figure base salary. With a few years of experience, the total compensation at a FANG company - Facebook, Apple, Netflix, Google and the like - can reach $400,000. Startups 1 and other major tech hubs like Seattle and New York City aren’t far behind.

So what makes front-end engineers unique to demand such a high price tag? Many people question whether they are engineers at all. Here are my learnings, having worked as one for a decade, and building 10-person front-end engineering teams.

What’s a “Front-End Engineer”?

“Front-end” refers to the presentation layer, or user interface (UI), of software. Front-end engineers typically implement UI using web technologies. Building interactive applications differentiates front-end engineers from web developers, who traditionally build websites focused on content. If they develop for another platform such as iOS, they may be called UI engineers or iOS engineers. If the role has a heavy emphasis on design, they may be called UX engineers.

I am biased, but my experience leads me to strongly believe that the best front-end engineers specialize in UI implementation. They hone their craft in this area, and stay up-to-date with ballooning UI technology stacks. Full-stack engineers do front-end work. They’re great for small teams building product from 0 to 1, and lacking resources to specialize. A full-stack engineer doesn’t magically multiply as a front-end engineer, a back-end engineer, a site reliability engineer and a data analyst. The context switch cost between disciplines means they cannot dive deep into a specific area.

The Most Visible Job

I always thought I got the short end of the stick as a front-end engineer. Button doesn’t click? My fault. Search results are crap? My fault too, even though the source data is crap. Users can only report what they see. And since I was the guy writing what users see, naturally everything was my fault. But I couldn’t tell users that. They don’t care if the problem is with the data or API service. All they know is they searched for Apple and pictures of apples showed up.

This may come as a surprise to you - software engineers don’t spend the majority of their time writing code. A lot of time is spent on communication. Front-end engineers builds and defends the business front line. They are the first to hear about burning user requests, triage them, and work with other teams to ship what users see. With great visibility comes the need for finesse to managing optics.

UI Implementation Is Hard

If I could tell myself from five years ago anything about my job, it would be that UI programming is really hard, like lock-free concurrency hard.

― Kyle Macomber Apple Software Engineer, on SwiftUI

Well implemented UI builds user’s trust in the product. Trust directly translate into revenue - web apps loose 10% of users for every additional second they take to load 2. Front-end engineers go to extraordinary lengths to shave milliseconds off load times, just like how Boeing engineers shave grams off airplane weight. For example, Stripe Billing’s homepage loads in under 1 second on a mobile 3G connection. The size downloaded to your device is smaller than Google’s homepage, which is notorious for being lightweight. But wait a minute, how did they sneak a high resolution video in there?

“Video” on Stripe.com

When you look closer with developer tools, you will see the “video” is just simple HTML shapes meticulously composed together and animated using CSS. HTML and CSS are much lighter than a video, because they are just text instructions telling the browser how to render the UI. This technique also has the added benefit of looking great regardless of the screen scale resolution. Try zooming in - the video will always be sharp. This is the kind of artful engineering that wows your users.

“Video” on Stripe.com - not an actual video

Performance is just one of the many aspects of a well-implemented UI. Want to serve users on mobile devices, where they spend most of their time? Front-end engineers can adapt the UI for 4 iPhone sizes and hundreds of Android phone sizes, without building a separate UI for each. Want to serve 1.4 billion users in China? Front-end engineers can build an internationalization framework so your app can be easily translated into any language by any translator. Want to be inclusive and comply with ADA accessibility standards? Front-end engineers can make the entire app accessible via keyboard and screen readers. The numerous audiences and environments where your app can be used make front-end engineering difficult. These skills are not taught in schools, and front-end engineers put in a lot of effort outside of work to keep up with the fast-moving web platform.

More Than Just an Engineer

Another aspect of a well implemented UI is consistency. Who cares if a button has an 1 pixel border, and another has a 2 pixel border? I get into this argument with my friends all the time, engineers or not. My mentor Charles d’Harcourt said it best - when users see human interface elements that don’t look or behave the way they expect, they lose trust in the product. He saw this again and again on many high-profile products he worked on, like WebObject, iTunes and Chrome.

Front-end engineers are more than just engineers. They use their design intuition and user empathy to elevate user interface to a human level. To me, these are the most important things that separates the best front-end engineers from the rest. Day-to-day, this means collaborating well with product managers and designers, balancing requirements and implementation difficulty to ship what users want, and addressing bugs and inconsistency with minimal review cycles.

Design intuition and user empathy are hard to tease out during interviews. They seem to come naturally to many of the best front-end engineers I’ve worked with. Their education tend to be interdisciplinary. They enjoy tearing down well designed products. They also have creative, artsy hobbies. Some schools, such as the Stanford d.school, teach a blend of art and engineering, but the nature of getting into d.school creates a selection bias. If you have examples of how design intuition and user empathy can be consistently taught, I’d love to hear from you.

The Cost of a High Performing Front-End Engineering Team

Despite my love for front-end engineering, I also learned UI fit and finish isn’t a prerequisite to a strong product. Solving users problems is. Craigslist is a classic example with its simple, text-focused UI. If you really want to build the best team, you should first ask yourself whether you want to, and can, differentiate your business based on UI.

Like all the best engineers, front-end engineers are attracted to leaders in their field, and other like-minded people. Do you have existing talent and high-profile, polished UI which can attract more talent? Stripe attracts talent from FANG companies and Tier 1 schools because it decided design and UI is a big differentiator in the developer tools field, and it has the product and talent to match.

If you focus intently on hiring the best people you can find and pay them top dollar, chances are your business growth will more than make up for what you spend on compensation.

― Patty McCord Netflix Chief Talent Officer, on How to Hire

Building a high performing front-end engineering team requires a competitive budget. That 10x front-end engineer who’d love to build a decentralized Internet with you would also love to get a 50% pay bump at Facebook. There are many good front-end engineers who do not demand Silicon Valley level compensation. It takes extra effort to find the hidden gems. Maybe you need to mine GitHub for relevant open source projects. Or open a remote engineering center of excellence, like Square has done in Waterloo and Atlanta. Be careful with setting unreasonably low budgets. Employee turnover costs are high. The risk of not building your product “correctly” will cause headache and drain more budget down the road.

  1. If you’re curious what top startups backed by top VCs pay their talent, check out HiringPlan, the free compensation planning tool my team built at LTSE, with built-in market data. 

  2. See the studies sited in this piece on Why Performance Matters. You can also estimate the direct revenue impact resulted from app performance with this nifty tool

Updated
June 2019

I'd love to hear what you think about this essay. Your feedback makes my work better. You can chat with me on Twitter and Hacker News .