Search code examples
javascriptjquerycssperformancewebpage-rendering

how to reference elements in CSS or JS files for fastest parsing?

I'm trying to improve a websites rendering speed.

Both CSS and JS files mostly reference elements like this:

Javascript:

   $('.some_element').doSth()

CSS:

   .some_element { /* do something */ }

Just curious - is this the optimal way of referencing elements in terms of javascript parsing and website rendering? Wouldn't it be better to do something like div.some_element?

Thanks for some infos!

Solution

  • If speed is a priority you might want to switch to vanilla javascript as much as you can. Native javascript is faster than jQuery.

    If you want to keep your jQuery selector use parent context to make the search for the element more efficient. Example $('#parent').find(child)

    You can find more tips on javascript an jquery optimization on the web: http://engineeredweb.com/blog/10/12/3-tips-make-your-jquery-selectors-faster/