CODEWITHSUNDEEP
javascriptcssperformanceexternalrender
S. Valmont
S. Valmont

Reputation: 1021

Speed Up Page by Using Javascript to Render Elements?

Just on the basis that best practices tell us to favor external CSS and JS files over inline HTML for performance advantages.

Is it a good idea to deliver as small an HTML file as we can manage? And use Javascript / jQuery to render as much of the DOM as we can, hook up Javascript events, etc. on the client side?

Upvotes: 2

Views: 248

Answers (2)

Kenneth
Kenneth

Reputation: 28737

In general, giving the browser the HTML is faster.

Of course, everything depends on how long the server takes to create this HTML.

But in terms of client-side rendering, a pre-built HTML will always win over a javascript generated document. This is because the DOM-API is relatively slow (although a lot of improvements have been made lately).

The separation of CSS and JS is more related to maintainability and SEO.

Upvotes: 1

mfeingold
mfeingold

Reputation: 7154

The reason to keep CSS and JS in separate files has nothing to do with performance. If anything it can slow down your page because of additional roundtrips to the server.

The real reason is that for a web page (application) of any complexity it is extremely important to keep the logical structure of your page (declarative HTML) separate from the layout (CSS) and from the UI logic (Javascript).

Performance issues can and should be addressed separately using caching, minification, etc.

Upvotes: 2

Related Questions