Rebuilding a faster, lazier Slack

C0b42577cfc2b321be3474618107e933?s=47 samanthasiow
November 08, 2019

Rebuilding a faster, lazier Slack

A new version of Slack is rolling out for our desktop customers, built from the ground up to be faster, more efficient, and easier to work on. In this talk, I’ll focus on our move from an eager data model to a lazily loaded and incomplete data model, and how that made for a speedier Slack experience.

C0b42577cfc2b321be3474618107e933?s=128

samanthasiow

November 08, 2019
Tweet

Transcript

  1. 3.
  2. 4.

    Handlebars & Smarty templates Manual DOM updates via jQuery Multiple

    processes for multiple workspaces Eager data loading LEGACY
  3. 5.
  4. 6.
  5. 7.

    All UI components built in React Single process for multiple

    workspaces Lazily-loaded and incomplete data model MODERN
  6. 8.
  7. 9.
  8. 10.
  9. 11.
  10. 16.
  11. 25.
  12. 26.
  13. 27.
  14. 32.

    ???

  15. 33.

    ???

  16. 34.
  17. 36.
  18. 37.
  19. 46.

    1. Prioritize 2. Parallelize Solutions: 3. The early bird get

    the worm API calls first meaningful paint on the screen faster
  20. 51.
  21. 52.

    References & Credits Mark Christian & Johnny Rodgers - bit.ly/slack-rebuild

    When a rewrite isn’t: rebuilding Slack on the desktop Service Workers at Slack: Our Quest for Faster Boot Times and Offline Support Jim Whimpey - bit.ly/slack-sw Introducing a snappier, more efficient Slack desktop experience tiny.cc/slack-intro Slide theme: Bitter Sweet Templates for Keynote - DesiGN (https://apps.apple.com/us/app/themes-for-keynote/id935290998?mt=12) Anuj Nair - bit.ly/slack-gantry Gantry: Slack’s Fast-booting Frontend Framework Anuj Nair - bit.ly/slack-sonic Sonic: A Slack Modernization Project
  22. 53.

    slack.engineering References & Credits Mark Christian & Johnny Rodgers -

    bit.ly/slack-rebuild When a rewrite isn’t: rebuilding Slack on the desktop Service Workers at Slack: Our Quest for Faster Boot Times and Offline Support Jim Whimpey - bit.ly/slack-sw Introducing a snappier, more efficient Slack desktop experience tiny.cc/slack-intro Slide theme: Bitter Sweet Templates for Keynote - DesiGN (https://apps.apple.com/us/app/themes-for-keynote/id935290998?mt=12) Anuj Nair - bit.ly/slack-gantry Gantry: Slack’s Fast-booting Frontend Framework Anuj Nair - bit.ly/slack-sonic Sonic: A Slack Modernization Project