Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Jun 2013
    Location
    Calgary AB,Canada
    Posts
    55
    Thanks
    28
    Thanked 1 Time in 1 Post

    Performance Issue

    Hi,

    Will anybody please tell me of any performance issues between the following 2 statements please ?


    var x = $('#myTextBox').val();

    vs

    var x=document.getElementById("myTextBox").value;


    And when it comes to mobile applications, which is preferable ?




    Another question. Suppose I am loading the JQuery library in my web application, but am NOT using it but using pure vanila JavaScript, will it make any difference in performance compared to not loading it and using pure vanila JS?


    Thanks a bunch,


    Isaac
    Last edited by Isaac Sureshkum; 01-14-2014 at 06:06 PM.

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,778
    Thanks
    6
    Thanked 1,021 Times in 994 Posts
    Both questions have the same answer: not loading an additional script is faster than loading one. Therefore, native JS has a better performance than framework-powered JS and loading jQuery and not using it (or using it just for a simple task) is stupid.

  • Users who have thanked VIPStephan for this post:

    Isaac Sureshkum (01-14-2014)

  • #3
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,074
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Vanilla JS will always execute faster than jQuery. See this js performance test: http://jsperf.com/val-vs-value

    As to your second question. Of course, it will affect performance. Why are you loading jQuery if you are not using it?
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • Users who have thanked glenngv for this post:

    Isaac Sureshkum (01-14-2014)

  • #4
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,400
    Thanks
    11
    Thanked 595 Times in 575 Posts
    the performance of both is the same. Notice the "slow" jQuery version still does 100,000+ operations a second. unless you have 10,000 textboxes, even a ninja can't spot the real-world difference. If you have 10,000 text boxes, then your page will be render and interact slow for other reasons anyway. Regardless, performance is the last common factor you should be considering when it comes to grabbing form values into JS variables. Readability, maintainability, and scaling are a lot more important factors than saving the few micro-seconds only a synthetic benchmark can reveal...

    Loading but not using jQuery will have no effect upon vanilla javascript running at the same time as jQuery. Prototype.js can slow down jQuery and vanilla code, but jQuery is better than that. Other than the delay of physically loading the library, which can be avoiding using a cdn and the defer attribute, there's not much happening. while the page with jQuery may take up to a quarter-second longer to come up on a slow day, the speed at which the js runs is always the same.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.6, IE11:9.1, IE9:3.1, IE10:3.0, FF:17.2, CH:46, SF:11.4, NON-MOUSE:38%

  • Users who have thanked rnd me for this post:

    Isaac Sureshkum (01-14-2014)

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    26,561
    Thanks
    80
    Thanked 4,492 Times in 4,456 Posts
    I think it's even less of a performance difference than RndMe has pointed out.

    After all, you are asking to find *ONE* element in the DOM in either case.

    Even if you had 10,000 elements (as opposed to 1 element), the time difference in finding ONE SINGLE ELEMENT by id is *NOT* linear. It is dependent on the efficiency of the DOM indexing system as rendered by the NATIVE library in the browser.

    Oh, it could be linear, if some browser was really written so dumb as to search for an id by simply looking through all the elements. But do you really think that, in today's browser wars, any browser would be written that horribly inefficiently???

    In short: You are worrying about all the wrong things. Find something worth actually fretting a tiny bit about.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    Isaac Sureshkum (01-14-2014)

  • #6
    New Coder
    Join Date
    Jun 2013
    Location
    Calgary AB,Canada
    Posts
    55
    Thanks
    28
    Thanked 1 Time in 1 Post
    Thank You...

  • #7
    New Coder
    Join Date
    Jun 2013
    Location
    Calgary AB,Canada
    Posts
    55
    Thanks
    28
    Thanked 1 Time in 1 Post
    Thanks a lot guys......VIPStephen, genngv, rnd me, Old Pedant

    Really appreciated for good explanation.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •