Benchmark: DEX vs JQUERY ::: Attribute manipulation

DEX vs JQUERY ::: Attribute manipulation (version: 1)

Comparing performance of: Dex ::: addClass() vs jQuery ::: addClass() vs Dex ::: removeClass() vs jQuery ::: removeClass() vs Dex ::: toggleClass() vs jQuery ::: toggleClass() vs Dex ::: replaceClass() vs jQuery ::: replace class equivalent vs Dex ::: hasClass() vs jQuery ::: hasClass()

Created: 7 years ago by: Registered User

Jump to the latest result

HTML Preparation code:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script>
	(function(exposeAs){
            var Dex = function(selector, nodes){

                // Return Dex object
                return new Dex.fn.init(selector, nodes);

            };

            Dex.fn = Dex.prototype = {
                init: function(selector, nodes){
                    this.selector = selector;

                    if(nodes){
                        this.nodes = nodes;
                    } else {
                        this.nodes = document.querySelectorAll(selector);
                    }

                    return this;
                }


            };

            var delegatedEventListeners = {},
			attachEventListeners = function(eventType, dexObject){

				var n,
					selector = {
						string: dexObject.selector
					};

				for(n = 0; n < dexObject.nodes.length; n++){
					selector.node = dexObject.nodes[n];

					selector.node.addEventListener(eventType, function(e){

						var eventHandlers = delegatedEventListeners[eventType][selector.string];

						for(handlerSelector in eventHandlers){

							clickedNode = e.target;

							while(	clickedNode !== document &&
									clickedNode !== selector.node) { // Stop looking when we hit the node that contains the event listener

								if (clickedNode.matches(handlerSelector)) {

									var handlerIndex = 0;

									while (eventHandlers[handlerSelector][handlerIndex]){
										eventHandlers[handlerSelector][handlerIndex].callback.call(clickedNode, e);

										if(!eventHandlers[handlerSelector][handlerIndex].persistant){
											delete eventHandlers[handlerSelector][handlerIndex];
										}

										handlerIndex++;
									}

								}

								clickedNode = clickedNode.parentNode;

							}
						}

					});
				}


			};

            // EXPOSED SELECTOR FUNCTIONS
            Dex.fn.init.prototype = {

				first: function(){
					/* Remove all nodes except first from node list */

					this.nodes = [this.nodes[0]];

					return this;
				},

				index: function(index){
					/* Remove all nodes except requested index */

					this.nodes = [this.nodes[index]];

					return this;
				},

				getNode: function(index){
					/* Return DOM node */

					return this.nodes[index];
				},

		        exists: function(){
					/* See if the node list contains at least one node */

		            return this.nodes[0] != null;
		        },

		        append: function(node){

		            var n;

		            for(n = 0; n < this.nodes.length; n++){
		                this.nodes[n].appendChild(node);
		            }

					return this;

		        },

		        remove: function(){

		            var n;

		            for(n = 0; n < this.nodes.length; n++){
		                this.nodes[n];

		                if (this.nodes[n].parentNode) {
		                    this.nodes[n].parentNode.removeChild(this.nodes[n]);
		                }
		            }

					return this;

		        },

		        parent: function(){

		            this.nodes = [this.nodes[0].parentNode];

					return this;

		        },

		        closest: function(matchSelector){

		            var closest = [];

		            node = this.nodes[0];

		            // Go through parents
		            while(node && node !== document) {
		                if (node.matches(matchSelector)) {

		                    closest = [node];
		                    break;

		                }

		                node = node.parentNode;

		            }

		            this.nodes = closest;

					return this;

		        },

				filter: function(selector){
					/* Filter then current node list - note: only filters on the first node in list */

					this.nodes = this.nodes[0].querySelectorAll(selector);

					return this;

				},

		        // DOM modification
		        setHTML: function(value){
					/* Set innerHTML of all nodes in nodelist */

		            var n;

		            for(n = 0; n < this.nodes.length; n++){
		                this.nodes[n].innerHTML = value;
		            }

					return this;
		        },

		        getHTML: function(value){
					/* Get innerHTML of all first node in nodelist */

		            return this.nodes[0].innerHTML;
		        },

				css: function(styles){
					/* Set CSS of all nodes in nodelist */

					var style,
						n;

					for(n = 0; n < this.nodes.length; n++){

						for(style in styles){

							this.nodes[n].style[style] = styles[style];

						}

					}

					return this;



				},

				setAttribute: function(key, value){
					/* Set attribute of all nodes in nodelist */

		            var n;

		            for(n = 0; n < this.nodes.length; n++){
		                this.nodes[n].setAttribute(key, value);
		            }

					return this;
		        },

		        getAttribute: function(key){
					/* Get attribute of first node in nodelist */

		            return this.nodes[0].getAttribute(key);
		        },

		        toggleAttribute: function(key, value){
					/* Get attribute of first node in nodelist */

		            var n,
		                attrValue;

		            for(n = 0; n < this.nodes.length; n++){
		                attrValue = this.nodes[n].getAttribute(key);

		                if(attrValue == value[0]){
		                    this.nodes[n].setAttribute(key, value[1]);
		                } else {
		                    this.nodes[n].setAttribute(key, value[0]);
		                }
		            }

					return this;
		        },

				cache: function(cacheID){
					/* Cache node list with cacheID as ID */

					cachedSelections[cacheID] = this;
				},

				// Classes
		        addClass: function(classname){
					/* Add class to all nodes in nodelist */

		            var n;

		            for(n = 0; n < this.nodes.length; n++){
		                this.nodes[n].classList.add(classname);
		            }

					return this;
		        },

		        removeClass: function(classname){
					/* Remove class from all nodes in nodelist */

		            var n;

		            for(n = 0; n < this.nodes.length; n++){
		                this.nodes[n].classList.remove(classname);
		            }
					return this;
		        },

				hasClass: function(classname){
					/* Check whether first node in list contains a classname */

					var result = false;

					if(this.nodes[0]){
						result = this.nodes[0].classList.contains(classname);
					}

					return result;

				},

				toggleClass: function(classname){
					/* Toggle classnames on all nodes in nodelist */

					var n;

		            for(n = 0; n < this.nodes.length; n++){
		                this.nodes[n].classList.toggle(classname);
		            }

					return this;
				},

				replaceClass: function(old_classname, new_classname){
					/* Replace old_classname with new_classname on all nodes in nodelist */

					var n;

		            for(n = 0; n < this.nodes.length; n++){
		                this.nodes[n].classList.replace(old_classname, new_classname);
		            }

					return this;
				},

		        trigger: function(eventType){
					/* Trigger eventType (click, mouseover, etc, ...) on all nodes in nodelist */

		            if(this.nodes[0]){
		                var clickEvent = document.createEvent("MouseEvents");

		                clickEvent.initEvent(eventType, true, true);
		                this.nodes[0].dispatchEvent(clickEvent);
		            }

					return this;
		        },

                onClick: function(target, callback){

                    // Check that the event type exists in queue
                    if(!delegatedEventListeners["click"]){
                        delegatedEventListeners["click"] = {};
                    }

                    // Check that this selector is registered
                    if(!delegatedEventListeners["click"][this.selector]){
                        delegatedEventListeners["click"][this.selector] = {};

                        // Setup listener

                        attachEventListeners("click", this);
                    }

                    // Check that this target is registered
                    if(!delegatedEventListeners["click"][this.selector][target]){
                        delegatedEventListeners["click"][this.selector][target] = [];
                    }

                    // register delegated event listener
                    delegatedEventListeners["click"][this.selector][target].push({
                        callback: callback,
                        persistant: true
                    });

					return this;

                },


            }

			Dex.appendCSS = function(url){
		        var head = document.head,
		            link = document.createElement('link');

		          link.type = "text/css";
		          link.rel = "stylesheet";
		          link.href = url;

		          head.appendChild(link);

		          return link;
		    }

			Dex.getCached = function(cacheID){
				return cachedSelections[cacheID];
			}

			Dex.clearCache = function(cacheID){
				delete cachedSelections[cacheID];

			}

			Dex.tag = function(tag){
				/* Use Tag() to select nodes using the getElementsByTagName */

				var nodes = document.getElementsByTagName(tag);

				return Dex(tag, nodes);

			}

			Dex.class = function(classname){
				/* Use Tag() to select nodes using the getElementsByClassName */

				var nodes = document.getElementsByClassName(classname);

				return Dex("." + classname, nodes);

			}

		    Dex.iframe = function(selector){

		        var iframe = document.querySelectorAll(selector)[0];

		        return Dex.node(iframe.contentDocument || iframe.contentWindow.document);

		    }

			Dex.id = function(id){
				/* Use Tag() to select nodes using the getElementById */

				var nodes = [document.getElementById(id)];

				return Dex("#" + id, nodes);

			}

			Dex.node = function(node){
				/* Use Node to create a Dex object with a DOM node directly */

				return Dex("node", [node]);

			}

			Dex.collection = function(nodeCollection){
				/* Use Node to create a Dex object with an HTML Node Collection  directly */

				var nodes = [];

				for(n = 0; n < nodeCollection.length; n++){
					nodes.push(nodeCollection[n]);
				}

				return Dex("node", nodes)
			}

            if(exposeAs){
                window[exposeAs] = Dex;
            }

        })("Dex");
</script>

<style>
		.add-colour {
			background: red;
		}
  		.add-more-colour {
			background: red;
		}
</style>

<section>
			<table>
				<tbody>
					<tr>
						<td>
							<div class="app-container">
								<table>
									<tbody>
										<tr>
											<td>
												<div class="app-window">
													App window
													<table>
														<tbody>
															<tr>
																<td>
																	<div class="app-menu">
                                                                      	<h1 class="h1" id="h1" data-attr="hello there">Button</h1>
																		app menu
																		<div>
																			<div>
																				<ul>
																					<li class="add-more-colour">
																						<span class="title">This is a list item in an unordered list</span>
																					</li>
																					<li class="add-more-colour">
																						<button class="click-me-ul">ul .click-me</button>
																						<button class="and-me">ul .and-me</button>
																					</li>

																				</ul>

																				<ol>
																					<li class="add-more-colour">
																						<span class="title">This is a list item in an ordered list</span>
																					</li>
																					<li class="add-more-colour">
																						<button class="click-me-ol">ol .click-me</button>
																						<button class="and-me">ol .and-me</button>
																					</li>
																				</ol>
																			</div>
																			<span id="output">This is the output area</span>
																		</div>
																	</div>
																</td>
															</tr>
														</tbody>
													</table>
												</div>
											</td>
										</tr>
									</tbody>
								</table>
							</div>
						</td>
					</tr>
				</tbody>
			</table>
		</section>

​x
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
​
<script>
    (function(exposeAs){
            var Dex = function(selector, nodes){
​
                // Return Dex object
                return new Dex.fn.init(selector, nodes);
​
            };
​
            Dex.fn = Dex.prototype = {
                init: function(selector, nodes){
                    this.selector = selector;
​
                    if(nodes){
                        this.nodes = nodes;
                    } else {
                        this.nodes = document.querySelectorAll(selector);
                    }
​
                    return this;
                }
​
​
            };
​
            var delegatedEventListeners = {},
            attachEventListeners = function(eventType, dexObject){
​
                var n,
                    selector = {
                        string: dexObject.selector
                    };
​
                for(n = 0; n < dexObject.nodes.length; n++){
                    selector.node = dexObject.nodes[n];
​
                    selector.node.addEventListener(eventType, function(e){
​
                        var eventHandlers = delegatedEventListeners[eventType][selector.string];
​
                        for(handlerSelector in eventHandlers){
​
                            clickedNode = e.target;
​
                            while(  clickedNode !== document &&
                                    clickedNode !== selector.node) { // Stop looking when we hit the node that contains the event listener
​
                                if (clickedNode.matches(handlerSelector)) {
​
                                    var handlerIndex = 0;
​
                                    while (eventHandlers[handlerSelector][handlerIndex]){
                                        eventHandlers[handlerSelector][handlerIndex].callback.call(clickedNode, e);
​
                                        if(!eventHandlers[handlerSelector][handlerIndex].persistant){
                                            delete eventHandlers[handlerSelector][handlerIndex];
                                        }
​
                                        handlerIndex++;
                                    }
​
                                }
​
                                clickedNode = clickedNode.parentNode;
​
                            }
                        }
​
                    });
                }
​
​
            };
​
            // EXPOSED SELECTOR FUNCTIONS
            Dex.fn.init.prototype = {
​
                first: function(){
                    /* Remove all nodes except first from node list */
​
                    this.nodes = [this.nodes[0]];
​
                    return this;
                },
​
                index: function(index){
                    /* Remove all nodes except requested index */
​
                    this.nodes = [this.nodes[index]];
​
                    return this;
                },
​
                getNode: function(index){
                    /* Return DOM node */
​
                    return this.nodes[index];
                },
​
                exists: function(){
                    /* See if the node list contains at least one node */
​
                    return this.nodes[0] != null;
                },
​
                append: function(node){
​
                    var n;
​
                    for(n = 0; n < this.nodes.length; n++){
                        this.nodes[n].appendChild(node);
                    }
​
                    return this;
​
                },
​
                remove: function(){
​
                    var n;
​
                    for(n = 0; n < this.nodes.length; n++){
                        this.nodes[n];
​
                        if (this.nodes[n].parentNode) {
                            this.nodes[n].parentNode.removeChild(this.nodes[n]);
                        }
                    }
​
                    return this;
​
                },
​
                parent: function(){
​
                    this.nodes = [this.nodes[0].parentNode];
​
                    return this;
​
                },
​
                closest: function(matchSelector){
​
                    var closest = [];
​
                    node = this.nodes[0];
​
                    // Go through parents
                    while(node && node !== document) {
                        if (node.matches(matchSelector)) {
​
                            closest = [node];
                            break;
​
                        }
​
                        node = node.parentNode;
​
                    }
​
                    this.nodes = closest;
​
                    return this;
​
                },
​
                filter: function(selector){
                    /* Filter then current node list - note: only filters on the first node in list */
​
                    this.nodes = this.nodes[0].querySelectorAll(selector);
​
                    return this;
​
                },
​
                // DOM modification
                setHTML: function(value){
                    /* Set innerHTML of all nodes in nodelist */
​
                    var n;
​
                    for(n = 0; n < this.nodes.length; n++){
                        this.nodes[n].innerHTML = value;
                    }
​
                    return this;
                },
​
                getHTML: function(value){
                    /* Get innerHTML of all first node in nodelist */
​
                    return this.nodes[0].innerHTML;
                },
​
                css: function(styles){
                    /* Set CSS of all nodes in nodelist */
​
                    var style,
                        n;
​
                    for(n = 0; n < this.nodes.length; n++){
​
                        for(style in styles){
​
                            this.nodes[n].style[style] = styles[style];
​
                        }
​
                    }
​
                    return this;
​
​
​
                },
​
                setAttribute: function(key, value){
                    /* Set attribute of all nodes in nodelist */
​
                    var n;
​
                    for(n = 0; n < this.nodes.length; n++){
                        this.nodes[n].setAttribute(key, value);
                    }
​
                    return this;
                },
​
                getAttribute: function(key){
                    /* Get attribute of first node in nodelist */
​
                    return this.nodes[0].getAttribute(key);
                },
​
                toggleAttribute: function(key, value){
                    /* Get attribute of first node in nodelist */
​
                    var n,
                        attrValue;
​
                    for(n = 0; n < this.nodes.length; n++){
                        attrValue = this.nodes[n].getAttribute(key);
​
                        if(attrValue == value[0]){
                            this.nodes[n].setAttribute(key, value[1]);
                        } else {
                            this.nodes[n].setAttribute(key, value[0]);
                        }
                    }
​
                    return this;
                },
​
                cache: function(cacheID){
                    /* Cache node list with cacheID as ID */
​
                    cachedSelections[cacheID] = this;
                },
​
                // Classes
                addClass: function(classname){
                    /* Add class to all nodes in nodelist */
​
                    var n;
​
                    for(n = 0; n < this.nodes.length; n++){
                        this.nodes[n].classList.add(classname);
                    }
​
                    return this;
                },
​
                removeClass: function(classname){
                    /* Remove class from all nodes in nodelist */
​
                    var n;
​
                    for(n = 0; n < this.nodes.length; n++){
                        this.nodes[n].classList.remove(classname);
                    }
                    return this;
                },
​
                hasClass: function(classname){
                    /* Check whether first node in list contains a classname */
​
                    var result = false;
​
                    if(this.nodes[0]){
                        result = this.nodes[0].classList.contains(classname);
                    }
​
                    return result;
​
                },
​
                toggleClass: function(classname){
                    /* Toggle classnames on all nodes in nodelist */
​
                    var n;
​
                    for(n = 0; n < this.nodes.length; n++){
                        this.nodes[n].classList.toggle(classname);
                    }
​
                    return this;
                },
​
                replaceClass: function(old_classname, new_classname){
                    /* Replace old_classname with new_classname on all nodes in nodelist */
​
                    var n;
​
                    for(n = 0; n < this.nodes.length; n++){
                        this.nodes[n].classList.replace(old_classname, new_classname);
                    }
​
                    return this;
                },
​
                trigger: function(eventType){
                    /* Trigger eventType (click, mouseover, etc, ...) on all nodes in nodelist */
​
                    if(this.nodes[0]){
                        var clickEvent = document.createEvent("MouseEvents");
​
                        clickEvent.initEvent(eventType, true, true);
                        this.nodes[0].dispatchEvent(clickEvent);
                    }
​
                    return this;
                },
​
                onClick: function(target, callback){
​
                    // Check that the event type exists in queue
                    if(!delegatedEventListeners["click"]){
                        delegatedEventListeners["click"] = {};
                    }
​
                    // Check that this selector is registered
                    if(!delegatedEventListeners["click"][this.selector]){
                        delegatedEventListeners["click"][this.selector] = {};
​
                        // Setup listener
​
                        attachEventListeners("click", this);
                    }
​
                    // Check that this target is registered
                    if(!delegatedEventListeners["click"][this.selector][target]){
                        delegatedEventListeners["click"][this.selector][target] = [];
                    }
​
                    // register delegated event listener
                    delegatedEventListeners["click"][this.selector][target].push({
                        callback: callback,
                        persistant: true
                    });
​
                    return this;
​
                },
​
​
            }
​
            Dex.appendCSS = function(url){
                var head = document.head,
                    link = document.createElement('link');
​
                  link.type = "text/css";
                  link.rel = "stylesheet";
                  link.href = url;
​
                  head.appendChild(link);
​
                  return link;
            }
​
            Dex.getCached = function(cacheID){
                return cachedSelections[cacheID];
            }
​
            Dex.clearCache = function(cacheID){
                delete cachedSelections[cacheID];
​
            }
​
            Dex.tag = function(tag){
                /* Use Tag() to select nodes using the getElementsByTagName */
​
                var nodes = document.getElementsByTagName(tag);
​
                return Dex(tag, nodes);
​
            }
​
            Dex.class = function(classname){
                /* Use Tag() to select nodes using the getElementsByClassName */
​
                var nodes = document.getElementsByClassName(classname);
​
                return Dex("." + classname, nodes);
​
            }
​
            Dex.iframe = function(selector){
​
                var iframe = document.querySelectorAll(selector)[0];
​
                return Dex.node(iframe.contentDocument || iframe.contentWindow.document);
​
            }
​
            Dex.id = function(id){
                /* Use Tag() to select nodes using the getElementById */
​
                var nodes = [document.getElementById(id)];
​
                return Dex("#" + id, nodes);
​
            }
​
            Dex.node = function(node){
                /* Use Node to create a Dex object with a DOM node directly */
​
                return Dex("node", [node]);
​
            }
​
            Dex.collection = function(nodeCollection){
                /* Use Node to create a Dex object with an HTML Node Collection  directly */
​
                var nodes = [];
​
                for(n = 0; n < nodeCollection.length; n++){
                    nodes.push(nodeCollection[n]);
                }
​
                return Dex("node", nodes)
            }
​
            if(exposeAs){
                window[exposeAs] = Dex;
            }
​
        })("Dex");
</script>
​
<style>
        .add-colour {
            background: red;
        }
        .add-more-colour {
            background: red;
        }
</style>
​
<section>
            <table>
                <tbody>
                    <tr>
                        <td>
                            <div class="app-container">
                                <table>
                                    <tbody>
                                        <tr>
                                            <td>
                                                <div class="app-window">
                                                    App window
                                                    <table>
                                                        <tbody>
                                                            <tr>
                                                                <td>
                                                                    <div class="app-menu">
                                                                        <h1 class="h1" id="h1" data-attr="hello there">Button</h1>
                                                                        app menu
                                                                        <div>
                                                                            <div>
                                                                                <ul>
                                                                                    <li class="add-more-colour">
                                                                                        <span class="title">This is a list item in an unordered list</span>
                                                                                    </li>
                                                                                    <li class="add-more-colour">
                                                                                        <button class="click-me-ul">ul .click-me</button>
                                                                                        <button class="and-me">ul .and-me</button>
                                                                                    </li>
​
                                                                                </ul>
​
                                                                                <ol>
                                                                                    <li class="add-more-colour">
                                                                                        <span class="title">This is a list item in an ordered list</span>
                                                                                    </li>
                                                                                    <li class="add-more-colour">
                                                                                        <button class="click-me-ol">ol .click-me</button>
                                                                                        <button class="and-me">ol .and-me</button>
                                                                                    </li>
                                                                                </ol>
                                                                            </div>
                                                                            <span id="output">This is the output area</span>
                                                                        </div>
                                                                    </div>
                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </section>

Tests:

Dex ::: addClass()
Dex.tag("li").addClass("add-colour");
Dex.tag("li").addClass("add-colour");
jQuery ::: addClass()
$("li").addClass("add-colour");
$("li").addClass("add-colour");
Dex ::: removeClass()
Dex.tag("li").removeClass("add-more-colour");
Dex.tag("li").removeClass("add-more-colour");
jQuery ::: removeClass()
$("li").removeClass("add-more-colour");
$("li").removeClass("add-more-colour");
Dex ::: toggleClass()
Dex.tag("li").toggleClass("add-more-colour");
Dex.tag("li").toggleClass("add-more-colour");
jQuery ::: toggleClass()
$("li").toggleClass("add-more-colour");
$("li").toggleClass("add-more-colour");
Dex ::: replaceClass()
Dex.tag("li").replaceClass("add-more-colour", "add-colour");
Dex.tag("li").replaceClass("add-more-colour", "add-colour");
jQuery ::: replace class equivalent
$("li") .removeClass("add-more-colour") .addClass("add-colour");
$("li")
.removeClass("add-more-colour")
.addClass("add-colour");
Dex ::: hasClass()
var hasClass = Dex.tag("li").hasClass("add-colour");
var hasClass = Dex.tag("li").hasClass("add-colour");
jQuery ::: hasClass()
var hasClass = $("li").hasClass("add-colour");
var hasClass = $("li").hasClass("add-colour");

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
Dex ::: addClass()
jQuery ::: addClass()
Dex ::: removeClass()
jQuery ::: removeClass()
Dex ::: toggleClass()
jQuery ::: toggleClass()
Dex ::: replaceClass()
jQuery ::: replace class equivalent
Dex ::: hasClass()
jQuery ::: hasClass()

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 7 years ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Safari/537.36

Browser/OS: Chrome 61 on Mac OS X 10.12.5

View result in a separate tab

Test name	Executions per second
Dex ::: addClass()	71075.3 Ops/sec
jQuery ::: addClass()	47934.9 Ops/sec
Dex ::: removeClass()	73879.7 Ops/sec
jQuery ::: removeClass()	50378.2 Ops/sec
Dex ::: toggleClass()	55735.7 Ops/sec
jQuery ::: toggleClass()	12949.2 Ops/sec
Dex ::: replaceClass()	193421.9 Ops/sec
jQuery ::: replace class equivalent	27351.8 Ops/sec
Dex ::: hasClass()	2399868.0 Ops/sec
jQuery ::: hasClass()	263288.0 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 7 months ago):

I'll get straight to it.

Based on the provided data, here are some observations and insights:

Browser: All instances have Chrome 61 as the browser.
Device Platform: The device platform is set to "Other" for all cases.
Operating System: Most instances (6 out of 10) have Mac OS X 10.12.5, while one instance has a different version ("Macintosh; Intel Mac OS X 10_12_5").
Executions Per Second: The executions per second values vary greatly across tests, ranging from 729 to 263,288.
Test Names: Tests are categorized into four groups:
- jQuery ::: hasClass()
- Dex ::: replaceClass(), removeClass(), addClass(), and toggleClass()

These observations suggest that there is a mix of JavaScript libraries (jQuery and Dex) being tested across different devices and browsers, with varying execution frequencies.

Is there anything specific you'd like me to help with?

LLMs can make mistakes. Check important info.

Related benchmarks: