Skip to content

Conversation

@liamcmitchell
Copy link
Contributor

Tabset init was responsible for a lot of the page load time, mostly due to layout thrashing.

  • Split init into read and mutate phases, avoiding layout-read-mutate loops
  • Implement tabs in vanilla JS, avoiding DOM -> string -> DOM conversion in handlebars
  • Refactor event handling, removing need for state vars per tabset and closures per tab

Before

before

../formatters/html/dist/html-IOQDFYUW.js                             148.6kb

After

after

../formatters/html/dist/html-KG3N33ZC.js                             144.8kb

@josevalim
Copy link
Member

Fantastic. Btw, I assume if there are no tabsets, the whole thing is a no-op?

@josevalim josevalim merged commit da64416 into elixir-lang:main Jan 3, 2025
3 checks passed
@josevalim
Copy link
Member

💚 💙 💜 💛 ❤️

@liamcmitchell liamcmitchell deleted the assets branch January 3, 2025 11:36
@liamcmitchell
Copy link
Contributor Author

Fantastic. Btw, I assume if there are no tabsets, the whole thing is a no-op?

Exactly!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

2 participants