Frontend Fest 2019

In April 2019 I attended Frontend Fest and wrote a post about my experience, but work was busy, life was crazy, and it never got published. Now a year later, in the midst of the Covid-19 pandemic, I’ve enjoyed going back and reading about the excitement of flying to Chicago (what is air travel?), staying in a hotel (there are places outside my house?) and meeting new people (GASP!). Without further ado, here’s my Frontend Fest recap.

On April Fools Day, I messaged the team to let them know I was heading to the airport, packed up my laptop and walked out the door. Without clarifying whether it was a joke or not, I got it my car and hit the road, leaving my coworkers to wonder about my not-very-funny sense of humor.

It had been several years since I last attended a Javascript conference (MidwestJS in Minneapolis). A regional conference in the upper midwest, MidwestJS was the first Javascript conference I attended, and it was a hugely positive experience. I met other developers who were using Ember (the framework of the moment), learned ES6 syntax that I had never seen before, and was introduced to the Twitter presences of several influential developers who I still follow today. In the intervening years, I’d hoped to attend another event like MidwestJS; being on a team of people who are obsessed with finding the latest and greatest tools can sometimes mean there’s too much noise, and I was excited to attend another Javascript conference and regain my focus, and learn something new.

The plane ride to Chicago was mostly uneventful. I slept for most of the flight, only briefly awakened by the west-facing, sunlit window nearly burning my arm off. After landing and finding my way outside, I took a few moments to enjoy the cool non-Texan breeze, then took the world’s most expensive taxi a few miles into the burbs to the Westin Itasca. For the next few days, I’d be spending all of my time at the hotel, attending FrontEnd Fest, a small Javascript conference put on by No Fluff Just Stuff.

Frontend Fest Banner

Tuesday morning the conference got rolling with a panel discussion featuring entertaining questions such as “Do we really need frameworks” (yes) and “What is your favorite completely defunct framework (jquery) and thoughtful questions like “What are common developer skill gaps, especially for people coming out of bootcamps” (testing, code readability, knowing how to learn difficult things) and “Should companies push developers to specialize in frontend/backend or full stack” (maximize developer happiness and encourage well-rounded devs). I wrote down my first inspirational Venkat quote of the conference, “Learn everything about something, learn something about everything” (Thomas Huxley) and chuckled at Yakov declaring that there are two things he’s given up trying to learn: regular expressions and CSS. After this entertaining start, I was feeling really great about heading to the first day’s sessions.

The very first session I attended turned out to be one of my favorites of the whole converence. Presented by Chris Lorenzo from Comcast, the talk was called Analyzing and Optimizing Your Web App Performance (slides here). Having recently received a mandate to make iOffice’s Space Desktop as fast as we can make it, this session piqued my interest because, while we’ve explored lazy loading, JS minification, and creating custom REST endpoints to retrieve exactly the information needed, I suspect that there are a lot of optimizations that we are not doing (and do not know about). The talk started with a discussion of how mobile internet usage has surpassed desktop usage, and how mobile devices are limited by connection quality and battery life. Because of these constraints, but obvious demand, setting up your web app to work as a PWA (offline capable, secure, cached) has seen a surge of interest. Even though Space Desktop is not mobile-focused, nor is it a PWA, the tools and strategies for enhancing app performance are amazingly relevant to us too.

Right out of the gate, Chris highlighted the webpack bundle analyzer, which we looked at probably a year ago, but not since. First thing onto my list! And speaking of webpack, did you know that you can add a notification from the bundle analyzer during CI? That’s pretty sweet, let’s put that on the list. Next up, he wanted to know how many people are using lodash, rxjs and momentjs. Check, check, check. Time to revisit those libraries and see whether they’re absolutely necessary in Space Desktop. Do we have a nested DOM tree? Shallower means that rendering and styling are significantly faster. Onto the list you go! Do we defer script loading so that they load asynchronously? Do we starting making API calls as soon as we possibly can? Can we separate our loading screen from the rest of the app so something paints as fast as possible? So many ideas and thought-provoking questions, but what really blew my mind was the Performance and Audit (Lighthouse) tabs in Chrome Dev Tools. I am a little horrified that I have never looked at those tabs. After a few minutes of poking around, with suggestions from Chris for what to look for, I noticed some significant “purple mountains” (aka rendering slow-downs) and a few enormous files taking excessive amounts of time to load (our translation file loads twice and what’s up with ionicons taking 6 seconds!?). Now the wheels are really turning and I’ve got stuff to try. I almost abandoned the next talk entirely but thankfully held course and went to the next session.

The following sessions on ngrx (of which I am quite the fan, and have been actively contemplating introducing to Space Desktop), Angular Cross-Cutting Concerns (similar to our Raygun service and API) and PWAs were relevant and interesting.

The day wrapped up with a classic, high-energy, fast-talking Venkat comparison between Angular, React and Vue. I reflected on my time at PROS when we made a weighted spreadsheet (just like Venkat recommends!) and went through this exercise with Ember and React. But amongst the details, there were some fabulous analogies: If manipulating the DOM yourself was driving a stick shift car, and jQuery was automatic transmission, Angular/React/Vue are Uber and Lyft. They do the driving, and you focus on your domain. What, I wonder, is public transportation in this analogy? And since Venkat seemed to be on a transportation kick, he then went on to compare React to a sailbot, and Angular to a cruise ship. “If you wanted a sailboat, but came home with a cruise ship, it’s too expensive. If you wanted a cruise ship and came home with a sailboat, you’ll be unhappy.” (In case you’re wondering Vue is a yacht.)

The final entertaining quote from the keynote was during a tangent about Angular and how it can do everything for you. “When you deviate from Angular conventions, Angular won’t be mad… but your colleagues will be!” It’s so true. There are a few instances where we’ve deviated from the recommended Angular path, and it has certainly caused confusion and anguish (Hybrid Router anybody!?).

Venkat's Framework Comparison

Day 2 started off with a web security workshop which started out absolutely fascinating and then went way over my head. My main takeaway from this talk was we’re doomed. I think Jeff would’ve thoroughly appreciated this talk, especially when he started off by saying that a lot of people think security is about securing the perimeter, but we don’t think about the people inside our boundaries who are idiots. Attackers won’t go to the trouble of trying to break your encryption when they can go through your employees.

My other favorite session from Day 2 was called Voice: The New Frontend, presented by Nara Kasbergen from NPR. This session is a perfect example of why I like attending conferences. You get to hear very smart people talk about areas that you may literally know nothing about. For example, I had no idea that there are browser based apis for speech recognition (converting speech to text, Chrome only) and synthesis (converting text to speech). Mozilla also has a voice project called CommonVoice. If you wanted to develop a voice “frontend” for Amazon Alexa (called “skills”) or Google (called “actions”), it’s important to claim your invocation name (like a web domain). According to Nara, companies are rushing to claim them. This is such a cool world, and one that I have started exploring as a consumer. I especially appreciated Nara’s tips about always working with a designer and not discounting the fact that humans want voice interfaces but still usually need visual cues. I definitely wonder whether iOffice will be venturing into the voice world (or even chatbots?) in the future.

And just like that, my time in Chicago was up. If you haven’t attended a conference before, I definitely recommend trying it. It’s refreshing being away from my desk and giving 100% of my attention to an enthusiastic presenter. I even enjoy making small talk during meals and wearing the cheesy conference t-shirt on the plane home.

Written on May 29, 2020