4 ms·

You’re also still paying a performance penalty for interacting with the virtual DOM in react. It’s not like react is just more complex to develop on, it’s also

You’re also still paying a performance penalty for interacting with the virtual DOM in react. It’s not like react is just more complex to develop on, it’s also a noticeably slower experience in some cases (looking at you, Reddit.) I’m also not completely convinced that the one-codebase ethos actually results in that much more efficiency, particularly given that one codebase is JavaScript. I’m sure there is a gain, but I don’t know that it completely offsets the costs of being so tightly bound to the JS community, but that could just be my experience

lukevp 6y ago
Vdom is a common point of premature optimization. React is very fast if you are rerendering components correctly. Turbo links is still having to diff just like react/vdom.
- welearnednothng 6y ago
  Turbolinks merges the contents of <head>, but replaces the contents of <body> outright. No diffing on the body. "During rendering, Turbolinks replaces the current <body> element outright and merges the contents of the <head> element. The JavaScript window and document objects, and the HTML <html> element, persist from one rendering to the next." https://github.com/turbolinks/turbolinks#navigating-with-turbolinks https://github.com/turbolinks/turbolinks#navigating-with-tur...
  - tomlagier 6y ago
    Not to be pedantic, but there is manual "diffing": https://github.com/turbolinks/turbolinks#persisting-elements-across-page-loads https://github.com/turbolinks/turbolinks#persisting-elements...
    - welearnednothng 6y ago
      Hey! I just saw this and thought I'd follow up for posterity's sake in case anyone else came across this. This gets into how we want to define "diffing", but I would say no, no there's not any diffing on the body, manual or otherwise. Per the linked section: "Before each render, Turbolinks matches all permanent elements by id and transfers them from the original page to the new page, preserving their data and event listeners." So, at no point is it attempting to determine a difference between two pages. Instead, it simply queries for appropriately tagged elements (from the source code, 'this.bodyElement.querySelectorAll("[id][data-turbolinks-permanent]') and copies those over to the next page. Thus, it's declarative rather than algorithmic and not what I would consider "diffing" at all. In this context, the parent to my comment stated it's "still having to diff just like react/vdom", which certainly isn't the case. Cheers!

lukevp 6y ago

Vdom is a common point of premature optimization. React is very fast if you are rerendering components correctly. Turbo links is still having to diff just like react/vdom.

welearnednothng 6y ago
Turbolinks merges the contents of <head>, but replaces the contents of <body> outright. No diffing on the body. "During rendering, Turbolinks replaces the current <body> element outright and merges the contents of the <head> element. The JavaScript window and document objects, and the HTML <html> element, persist from one rendering to the next." https://github.com/turbolinks/turbolinks#navigating-with-turbolinks https://github.com/turbolinks/turbolinks#navigating-with-tur...
- tomlagier 6y ago
  Not to be pedantic, but there is manual "diffing": https://github.com/turbolinks/turbolinks#persisting-elements-across-page-loads https://github.com/turbolinks/turbolinks#persisting-elements...
  - welearnednothng 6y ago
    Hey! I just saw this and thought I'd follow up for posterity's sake in case anyone else came across this. This gets into how we want to define "diffing", but I would say no, no there's not any diffing on the body, manual or otherwise. Per the linked section: "Before each render, Turbolinks matches all permanent elements by id and transfers them from the original page to the new page, preserving their data and event listeners." So, at no point is it attempting to determine a difference between two pages. Instead, it simply queries for appropriately tagged elements (from the source code, 'this.bodyElement.querySelectorAll("[id][data-turbolinks-permanent]') and copies those over to the next page. Thus, it's declarative rather than algorithmic and not what I would consider "diffing" at all. In this context, the parent to my comment stated it's "still having to diff just like react/vdom", which certainly isn't the case. Cheers!