javascript - Speed of jQuery selector seems to be wrong my code -

-

i working on optimizing code need disable first option in dropdown select menus. there 3 methods comparing find fastest one, can found here jquery-fastest-method-find-descendents

they are:

1. scope:  $(".child", $("#parent")); 2. find: $("#parent").find(".child");  3. 'normal': $("#parent .child");  (i call 'normal' because that's 1 use everything)

according linked article other posts have seen both 1 , 2 should same, 3 should slowest. however, rigged little timing fiddle , appears showing exact opposite.

fiddle here

for each of 3 tests fiddle create 1000 select menus, gives them 10 options each, , gives random select menus disable me class (i wanted variety see if changed results). timer begins, jquery selector goes in , finds .disableme , disables first option.

so can tell me why seeing opposite results of expecting? did mess in timing part of tests or maybe high level logic got confused?

code dont want fiddle:

function createmenus() {     $('body').empty();     (var = 0; < 1000; i++)     {          var select = $(document.createelement('select')).appendto($('body'));          if( math.round(math.random() * 1))                select.addclass("disableme");          (var j = 0; j < 10; j++)          {                 $(document.createelement('option')).appendto(select).html('optiontext');          }     } }  //.find() createmenus(); var start= date.now(); $('.disableme').find('option:nth-child(1)').attr('disabled', 'disabled'); var diff = date.now() - start; console.log("find: "+ diff )  //normal selector createmenus(); start= date.now(); $('.disableme option:nth-child(1)').attr('disabled', 'disabled'); diff = date.now() - start; console.log("'normal': "+ diff )  //scope selector createmenus(); start= date.now(); $('option:nth-child(1)', '.disableme').attr('disabled', 'disabled'); diff = date.now() - start; console.log("scope: "+ diff )

average results i'm seeing:

 find: 20  'normal': 4  scope: 16

this subjective. selector speed optimisation heavily browser dependent. post quoting time when ie7/8 still relevant. potentially ie6 relevant people.

the differences several:

  1. browser not have queryselector / queryselectorall - expression parsed , broken down bits work, such document.getelementbyid, document.getelementsbyclassname (if available), document.getelementsbytagname- appropriate filters applied, such pick nth type result etc. involve multiple regex , function calls.

  2. browser have queryselectorall - has been heavily optimised evergreen vendors. given expression not have pseudo expressions :is or :not or :has, straight forward pass through.

you can test on fiddle - http://fiddle.jshell.net/shewhqc4/show/light/

open console , use:

console.time('select'); console.log($$('.disableme option:nth-child(1)')); console.timeend('select');  console.time('selectjq'); console.log($('.disableme option:nth-child(1)')); console.timeend('selectjq');

first 1 qsa, second jquery - slower 8-9ms on ff.

the reason why other methods slower on evergreen browsers because not common usecase codepath (first) , second, need chain results , pass context more function calls.

ultimately, selector speed pointless measure it's rare have continuously search whole dom w/o caching results , unless writing game, gains meaningless.


Comments

Post a Comment

Popular posts from this blog

python - TypeError: start must be a integer -

-
i trying draw 5 turtles, getting typeerror on line 25. here code: import turtle wn = turtle.screen() redrose = turtle.turtle() color = input("what background color be?") fillcolor_f = input("what color of rose be?") redrose.hideturtle() redrose.speed(30) redrose.penup() redrose.left(180) redrose.forward(175) redrose.right(90) redrose.forward(30) redrose.right(90) redrose.pendown() def drawrose(red): redrose.color("pink") redrose.fillcolor(fillcolor_f) redrose.fill(true) in range(red): redrose.forward(i) redrose.right(49) in range(5): drawrose(redrose) redrose.penup() redrose.forward(350) redrose.right(144) redrose.pendown() redrose.fill(false) drawrose(50) wn.bgcolor(color) i trying draw 5 roses, produces errors. doing in interactivepython.org. you recursively calling drawrose wrong parameter. on line 23 ( for in range(red): ) expect red integer...
Read more

c# - DevExpress RepositoryItemComboBox BackColor property ignored -

-
i have following code almost works properly; private void cbstatus_drawitem(object sender, listboxdrawitemeventargs e) { string item = e.item string; if (item != null) { switch (item) { case "1": e.appearance.forecolor = color.green; e.appearance.backcolor = color.green; break; case "2": e.appearance.forecolor = color.orange; e.appearance.backcolor = color.orange; break; case "3": e.appearance.forecolor = color.red; e.appearance.backcolor = color.red; break; } } } when dropdown shown, items forecolor correct, backcolor remains whatever backcolor of theme is; i.e. if i've got set dark theme, backcolor dark, cells in gridview, rather being green/orange/red. i've tried setting e.appearance.options.usebackcolor trying set e....
Read more

django - Creating multiple model instances in DRF3 -

-
1) create multiple model instances 1 api call, asked here: how create multiple model instances django rest framework? tried solution named in link, no success. i trying upload multiple files in 1 api call. result: files uploaded (only once overwrote perform_create) 1 instance created (if send 2 files, latter created instance). my code: class fileuploadserializer(serializers.modelserializer): def __init__(self, *args, **kwargs): many = kwargs.pop('many', true) super(fileuploadserializer, self).__init__(many=many, *args, **kwargs) class meta: model = fileupload read_only_fields = ('created', 'datafile', 'owner') class fileuploadviewset(viewsets.modelviewset): queryset = fileupload.objects.all() serializer_class = fileuploadserializer parser_classes = (multipartparser, formparser, ) def perform_create(self, serializer): file_list = self.request.data.getlist('file') ...
Read more