Upgrade to Pro — share decks privately, control downloads, hide ads and more …

CascadiaJS 2021 - Creating a Culture of Frontend Performance

Andrew Hao
November 03, 2021

CascadiaJS 2021 - Creating a Culture of Frontend Performance

Andrew Hao

November 03, 2021

More Decks by Andrew Hao

Other Decks in Programming


  1. Let's go fast! Creating a culture of frontend performance @andrewhao

  2. We value performance

  3. But first, a detour From Liberian tailors and their apprentices,

    to Xerox representatives, back to us
  4. Learning + Practice Combined Tailors' Alley Apprentices Liberian Tailors Jean

    Lave, cultural anthropologist, embedded herself with the apprenticed tailors of Tailors' Alley in Monrovia, Liberia Image credit: "Jean Lave and community of practice"
  5. Learning + Practice Combined Tailors Alley Apprentices Liberian Tailors Learning

    is not done in a vacuum. Apprentices learned by participating in daily life as a tailor, in the community of craft. We learn by doing, with each other!
  6. Breakfast as information transfer ...this happened When this happened... Xerox

    Field Reps Xerox PARC anthropologists studied behaviors of Xerox techs in the field Community knowledge spread via breakfast! Images: [1], [2]
  7. Breakfast as information transfer ...this happened When this happened... Xerox

    Field Reps Xerox empowers the techs to create their own knowledge base to leverage organic learning. Saves Xerox $100MM! Images: [1], [2]
  8. Situated Learning

  9. Situated Learning "Community of Practice"

  10. Communi ties of Practice

  11. Communi ties of Practice ...in the modern software org ...in

    modern Agile practice
  12. "Spotify Model" Image: https://vitalitychicago.com/blog/there- is-no-spotify-model-for-scaling-agile/

  13. "Spotify Model" Gather functionally-similar folks together to hone their craft

    a.k.a. a "guild", or community of practice
  14. What is a Community of Practice?

  15. Scaling pains As the organization grows, coordination costs get higher

    Top-down decrees won't work Shift the culture through a community of practice!
  16. How it works at Lyft

  17. How it works at Lyft 1 Find your allies 2

    Define the charter (learning & practice) 3 Tap into intrinsic motivators (autonomy, mastery, purpose)
  18. How it works at Lyft 5 Low barriers to entry

    - learn by presenting 6 Record all presentations for archiving 4 Simple agenda & rotating roles
  19. Tools Lighthouse runner Lighthouse runner 1 Long-term performance trends &

    accountability Fight bundle bloat before merges Emit modern performance metrics across the fleet Bundle Size Reporter 2 3 Fleetwide Perfor- mance Dashboards Core Web Vitals Plugin 4 Emit modern performance metrics across the fleet Make metrics visible in on- call channels
  20. Tools are our most effective culture levers Making information visible

    through tooling is a powerful way to help people care about performance
  21. Docs Wins & case studies 1 Build the case for

    the value of Web perf on the business Great for onboarding and teaching perf concepts to newcomers Emit modern performance metrics across the fleet Tutorials and guides 2 3 SLO configs Guide people to set up their service for observability and reliability
  22. Time - bound We schedule to only run for a

    quarter at a time, which ensures that everybody involved is able to fully commit
  23. Over to you What change do you want to see?

    Where can you start a community?
  24. Start small Look for that one other person. Share some

    articles. Starting a brown bag discussion group.
  25. Don ' t wait for permission You can start today!

  26. Thanks ! Thanks to our very amazing community: Akif S,

    Andrew O, Eric B, Diana A, Faizan V, Jay M, Joanne D, Jose P, Kim T, Marcos I, Mihir M, Ming C, Paul Y, Seth T and many more