question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Perf: Direct Dom Rendering

See original GitHub issue

Right now, Angular always uses the Renderer to stamp out elements. If we know we run in the browser without web workers, we can do better:

  • Generate plain document.createElement / element.setAttribute / element.style.... = ... / element.someProp = ... calls
  • Add a flag directDom to CompilerOptions and tsconfig.json to opt into this behavior
  • Don’t store allNodes in prod mode any more

Can be implemented with or without #11673. If without: still have a helper function for createElement that automatically adds the right css classes

Add a plugin mechanism to support other kinds of rendering, e.g. for serverside rendering or webworkers or nativescript.

Also support typing the properties in which we store the elements correctly. E.g. with an HTMLDivElement, …

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:9
  • Comments:7 (6 by maintainers)

github_iconTop GitHub Comments

2reactions
tboschcommented, Nov 4, 2016

On by default. Only off in debug mode or when using web workers. On Thu, Nov 3, 2016 at 5:49 PM Suguru Inatomi notifications@github.com wrote:

As a result, direct rendering will be an optional feature? or a default behavior?

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/angular/angular/issues/11394#issuecomment-258316762, or mute the thread https://github.com/notifications/unsubscribe-auth/AAqKf80BtH-Z6oKsY4Vj54TcamdCmBedks5q6oExgaJpZM4J2SdZ .

0reactions
angular-automatic-lock-bot[bot]commented, Sep 11, 2019

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

Read more comments on GitHub >

github_iconTop Results From Across the Web

A 20x Speedup in Infinite DOM Rendering - Medium
An explained optimization technique of how Flicking achieved a 20x performance increase. Sometimes you have to show an infinite amount of ...
Read more >
The Fastest Way to Render the DOM | by Ryan Carniato
They render based on cloning template elements, they execute at runtime and make no use of a Virtual DOM. However, each does so...
Read more >
The process of rendering a page. Increasing the performance ...
We cover how the browser renders the page, what are the reflow, paint, and composition processes and how we can optimize the rendering....
Read more >
Chasing the best performance of rendering the DOM by ...
Render factory is a template engine agnostic. Most of the projects force users to use the template solution chosen by the authors. Sometimes...
Read more >
Taming huge collections of DOM nodes - codeburst
js for a while when we noticed that the rendering performance for one of our data tables was getting pretty horrible on low-power...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found