performance.now() 2018

Steve Souders

SpeedCurve, @souders

Steve works at SpeedCurve on the interplay between performance and design. He previously served as Google's Head Performance Engineer, Chief Performance Yahoo!, and Fastly's Chief Performance Officer. Steve pioneered much of the work in the world of web performance. He authored High Performance Web Sites and Even Faster Web Sites. He created many performance tools and services including YSlow, HTTP Archive, Episodes, ControlJS, and Browserscope. Steve taught CS193H: High Performance Web Sites at Stanford and served as co-chair of Velocity, the web performance and operations conference from O'Reilly.

Make JavaScript Faster

Everyone loves fast sites. While "make your site faster" is a simple mantra, the actual steps to achieve this can be daunting. Fortunately, we know where to start: JavaScript. JavaScript consumes twice as much CPU as loading, layout, and rendering combined. Byte-for-byte, JavaScript inflicts more delays on sites than any other resource, and yet the amount of JavaScript on sites continues to grow.

In this session you'll learn the latest techniques for measuring and improving the impact JavaScript on your site, including: using the User Timing Spec and Long Tasks API to track the CPU cost of JavaScript for real users, moving expensive JavaScript off the main thread, using code coverage tools to reduce your JavaScript, and understanding why defer is probably a better technique than async for loading JavaScript.

Video, slides

Harry Roberts

Independent, @csswizardry

With a client list including Google, Unilever, and the United Nations, Harry is an award-winning Consultant Front-end Architect who helps organisations and teams across the globe to plan, build, and maintain product-scale UIs.

A Google Developer Expert, and Performance Ambassador for SHIFT Commerce, he writes on the subjects of CSS architecture, performance, and scalability at csswizardry.com, develops and maintains inuitcss, authored CSS Guidelines, and Tweets at @csswizardry.

It's My (Third) Party and I'll Cry If I Want To

Like it or not, a huge part of modern web development involves the use of third-party providers: fonts, analytics, ads, tracking, and more all have an impact of performance, and can leave us (or, more worryingly, our visitors) susceptible to performance degradation.

In this talk, we'll take a look at unruly or uninvited (third-)party guests: how to detect them, how to audit them, and how to manage them. We'll also look at the different tools available to help us stress-test and quantify the overhead these third parties bring, and what that means for users and businesses alike.

Video, slides

Anna Migas

Lunar Logic, @szynszyliszys

Anna works as a Front-end Developer and Designer at Lunar Logic, the no-management software house based in Kraków, Poland. She is always trying to find ways to make people fall in love with coding and has a long history of organizing coding workshops for WebMuses and Rails Girls. She recently gained a title of Google Developer Expert. In her spare time she is skateboarding, travelling and reading sci-fi and fantasy books.

Fast but not Furious: Debugging User Interaction Performance Issues

Perceived performance is not only about fast page loads and delivering the content as early as possible. It is also about all the interactions happening on an already loaded page. Even some of the most popular UI patterns can be a cause of frustration. Understanding what is happening under the browser's hood can help you delight users with a smooth experience and avoid potential performance issues. Let's demystify the rendering process and look into possible optimisations in order to achieve the best experience after the initial page load.

During the talk you will learn: - what the browser rendering process looks like, - which UI patterns can be deadly to the website's performance when mixed with certain user interactions, - how we can help the browser with planning the optimisations ahead.

Video, slides

Adrian Holovaty

Soundslice, @adrianholovaty

Adrian is a longtime web developer best known for co-creating the Django web framework. His past work includes chicagocrime.org (a pioneering mashup that influenced the creation of the Google Maps API) and EveryBlock (which provided postcode-level news feeds for several cities).

These days, Adrian is building Soundslice, a music-learning site that syncs music notation with video performances and practice tools — all in your web browser. He lives in Amsterdam and gigs regularly with local gypsy-jazz groups.

How I optimized my JavaScript sheet music rendering engine

In this case study of soundslice.com, Adrian shares lots of performance tweaks he has used to make responsive sheet music layout perform well in web browsers.

Video

Zach Leatherman

Filament Group, @zachleat

Zach is a Web Developer with Filament Group. He’s fixated on web fonts, static site generators, the open web and open source. His public speaking résumé includes talks at Smashing Conference, O’Reilly Velocity, CSSConf, and the Obama-era White House. He also herds the NebraskaJS meetup and NEJS CONF.

The Five Whys of Web Font Loading Performance

Video, slides

Natasha Rooney

GSMA, @thisNatasha

Natasha has been both a web and application developer before becoming Director of Internet Engineering providing expertise on web technologies and internet protocols to the telecoms industry. She attends W3C and IETF working with both standards bodies to support and make recommendations for better user experiences on mobile and across the mobile network. She is a member of the W3C Advisory Board and the Stack Evolution Group at IETF. She is currently obsessed with TCP congestion control techniques, Japanese video games, and runs her own YouTube channel on travel particularly across Japan.

Down the line: Evolving HTTP and making things QUIC

Video, slides

Andrew Betts

Fastly, @triblondon

Andrew is a web developer and principal developer advocate for Fastly, working with developers across the world to help make the web faster, more secure, more reliable and easier to work with. He founded a web consultancy which was ultimately acquired by the Financial Times, led the team that created the FT’s pioneering HTML5 web app, and founded the FT’s Labs division. He is also an elected member of the W3C Technical Architecture Group, a committee of nine people who guide the development of the World Wide Web.

Headers for Hackers

Video, slides

Tammy Everts

SpeedCurve, @tameverts

Tammy is chief experience officer at SpeedCurve, where she helps companies understand how visitors use their websites, and a cochair of O’Reilly Fluent. Tammy has spent the past two decades studying how people use the web. Since 2009, she’s focused on the intersection between web performance, user experience, and business metrics. Her book, Time Is Money: The Business Value of Web Performance from O’Reilly, is a distillation of much of this research. She also cocurates (with Tim Kadlec) WPO Stats, a collection of performance case studies.

How I learned to stop worrying and love UX metrics

Video, slides

Tim Kadlec

Performance Consultant, @tkadlec

Tim is a performance consultant and trainer focused on building a web everyone can use. He is the author of High Performance Images (O'Reilly, 2016) and Implementing Responsive Design: Building sites for an anywhere, everywhere web (New Riders, 2012), and was a contributing author for Smashing Book #4: New Perspectives on Web Design (Smashing Magazine, 2013), and the Web Performance Daybook Volume 2 (O'Reilly, 2012). He writes about all things web at timkadlec.com. You can find him sharing his thoughts in a briefer format on Twitter at @tkadlec.

The Long-Tail of Performance

Successfully, and efficiently, delivering a site to visitors involves a lot of moving parts. The server has to spit something out, which gets passed over the network to the requesting device. The browser takes over from there, coordinating with the device to try and deliver the page as quickly as possible. When things go well, we barely notice and if we're not careful, neither do our metrics.

But there is a lot of unpredictability involved and if even one step is out of sync—if the device is overtasked, the network spotty, the browser old or unexpected—the performance can suffer dramatically. Welcome to the long-tail of performance, where the real world happens.

In this talk, we'll discuss what happens when the web bumps up against this less-than-ideal day to day reality. We'll zero in on these "long-tail" issues and explore how to ensure your sites perform well even when things go wrong. And as we address these issues, we'll end up making our sites more performant for everyone in the process.

Video, slides

Yoav Weiss

Google, @yoavweiss

Yoav Weiss has been working on mobile web performance for longer than he cares to admit, on the server side as well as in browsers. He now works as part of Google Chrome developer relations team, helping to fix web performance once and for all.

He takes image bloat on the web as a personal insult, which is why he joined the Responsive Images Community Group and implemented the various responsive images features in Blink and WebKit. That was his gateway drug into the wonderfully complex world of browsers and standards.

When he’s not writing code, he’s probably slapping his bass, mowing the lawn in the French countryside, or playing board games with his family.

Past, Present and Future of Resource Loading

Loading resources on the Web has always been a performance hurdle. Late discovery, contention and bloat caused it to be the common performance bottleneck. In recent years advances in protocols, browser behaviour and performance APIs improved resource loading significantly, but there’s still room to make it even faster.

In this talk we will go over resource loading improvements browsers have made in recent years, discuss related best practices and describe various innovations that are being worked on to improve resource loading even further.

Video, slides

Kornel Lesiński

Cloudflare, @kornelski

Author of ImageOptim, Pngquant and a few other popular image compression tools and libraries. Performance Engineer at Cloudflare. Formerly, JavaScript developer optimizing Financial Times' mobile webapp.

Image Optimization

Video

Katie Sylor-Miller

Etsy, @ksylor

Katie is a Staff Software Engineer on the Frontend Systems team at Etsy, where she advocates for and implements frontend best practices in collaboration with product engineers and designers. She is passionate about frontend architecture, design systems, style guides, accessibility, frontend performance, and teaching others. Katie recently co-authored the Design Systems Handbook and is participating in the Pastry Box Project, but her proudest accomplishment is creating ohshitgit.com to share her hard-won knowledge of how to get out of your git messes with a bit of humor (and a lot of swears).

Raiders of the Fast Start: Frontend Performance Archeology

There are a lot of books, articles, and online tutorials out there with fantastic advice on how to make your websites performant. It all seems easy in theory, but applying best practices to real-world code is anything but straightforward. Diagnosing and fixing frontend performance issues on a large legacy codebase is like being an archaeologist excavating the remains of a lost civilization. You don’t know what you will find until you start digging!

Pick up your trowels and come along with Etsy’s Frontend Systems team as we become archaeologists digging into frontend performance on our large, legacy mobile codebase. I’ll share real-life lessons you can use to guide your own excavations into legacy code:

• What tools and metrics we used to diagnose issues and track progress.
• How we went beyond server-driven best practices to focus on the client.
• Which fixes successfully increased conversion, and which didn’t.
• Our work, like all good archaeology, went beyond artifacts and unearthed new insights into our culture. We at Etsy pride ourselves on our culture of performance, but, like all cultures, it needs to adapt and reinvent itself to account for changes to the landscape. Based on what we’ve learned, we are making the case for a new, organization-wide, frontend-focused performance culture that will solve the problems we face today.

Video, slides

Jason Grigsby

Cloud Four, @grigs

Jason is co-founder of Cloud Four, a small web consultancy with big aspirations. He is founder and president of Mobile Portland where he helped start the world's first community device lab. He was the co-author of Head First Mobile Web and is author of a forthcoming book on progressive web apps (PWAs). He tracks PWA case studies at PWAStats.com. Jason is a sought‐after speaker and consultant on mobile and the web. You can find him blogging at cloudfour.com; on his personal site, userfirstweb.com; and on Twitter as @grigs.

PWA Challenges

Video, slides

Scott Jehl

Filament Group, @scottjehl

Scott is a designer/developer at Filament Group who lives in sunny Florida, USA. Scott is a tireless advocate of practices that ensure web access for all. He is a frequent presenter at conferences throughout the world and is always chipping away at various open source projects with his colleagues at Filament. Scott is the author of Responsible Responsive Design (2014, A Book Apart), and co-author of Designing with Progressive Enhancement (2010, New Riders). Scott also loves to surf.

Move Fast & Don't Break Things

Webpage performance is a high priority for any site of scale today, but it can be easier to build a fast site than it is to maintain one. As a site's features and design evolves, its performance is often threatened for a number of reasons, making it hard to ensure fast, broad access to services. In this session, Scott will consider common conflicts between performance and features such as advertising, personalization, A/B testing, CMSs, and JavaScript frameworks, and share some practices that have helped major sites defend their speed without compromises.

Video, slides

Michelle Vu

Pinterest, @micvu

Michelle is a Software Engineer on the Performance team at Pinterest. She's passionate about performance tooling, working on optimizations, and fighting regressions. When she's not coding, you can find her hiking in the mountains, traveling the world, or planning her next adventure.

Building a Foundation for Performance

Pinterest.com serves millions of requests per day internationally across a myriad of network conditions and devices. This is the story of how the web performance team tackled the task of gathering data, applied a strategic roadmap across the organization, prevented performance regression as developers shipped new features, executed on the best opportunities to improve the Pinterest experience for our users, and made performance a priority for the company.

Video

Paul Irish

Google, @paul_irish

Chrome developer tools aficionado (understatement) and Google web performance engineer, will present web performance metrics and measurements in 2018.

The Latest in Metrics & Measurement

Video