Repository: HubSpot/youmightnotneedjquery Branch: dev Commit: 2848af90368d Files: 314 Total size: 76.4 KB Directory structure: gitextract_5m9lppc8/ ├── .editorconfig ├── .github/ │ └── workflows/ │ └── build.yml ├── .gitignore ├── .prettierignore ├── .prettierrc.json ├── LICENSE ├── README.md ├── astro.config.ts ├── package.json └── src/ ├── comparisons/ │ ├── ajax/ │ │ ├── alternatives.json │ │ ├── json/ │ │ │ ├── ie10.js │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── load/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── post/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ └── request/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ ├── jquery.js │ │ └── modern.js │ ├── effects/ │ │ ├── alternatives.json │ │ ├── fade_in/ │ │ │ ├── ie10.css │ │ │ ├── ie10.js │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ ├── modern.css │ │ │ └── modern.js │ │ ├── fade_out/ │ │ │ ├── ie10.css │ │ │ ├── ie10.js │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ ├── modern.css │ │ │ └── modern.js │ │ ├── hide/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── show/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ └── toggle/ │ │ ├── ie8.js │ │ └── jquery.js │ ├── elements/ │ │ ├── add_class/ │ │ │ ├── ie10.js │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── after/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── alternatives.json │ │ ├── append/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── append_to/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── before/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── children/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ └── jquery.js │ │ ├── clone/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── closest/ │ │ │ ├── ie10.js │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ └── jquery.js │ │ ├── contains/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── contains_selector/ │ │ │ ├── alternatives.json │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── contents/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── create_elements/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── each/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── empty/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── filter/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── find_children/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── find_elements/ │ │ │ ├── alternatives.json │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── find_selector/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── first/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── get_attributes/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── get_height/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── get_html/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── get_outer_html/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── get_style/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ └── jquery.js │ │ ├── get_text/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ └── jquery.js │ │ ├── get_width/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── has_class/ │ │ │ ├── ie10.js │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── index/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── inner_height/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── inner_width/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── is_hidden/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── is_visible/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── last/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── matches/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── matches_selector/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── next/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── offset/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ └── jquery.js │ │ ├── offset_parent/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── outer_height/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── outer_height_with_margin/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── outer_width/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── outer_width_with_margin/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── parent/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── parents/ │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── position/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── position_relative_to_viewport/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── prepend/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── prev/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── remove/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── remove_attributes/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── remove_class/ │ │ │ ├── ie10.js │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── replace_from_html/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── scroll_left/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── scroll_top/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── serialize/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── set_attributes/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── set_height/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── set_html/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── set_style/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── set_text/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ └── jquery.js │ │ ├── set_width/ │ │ │ ├── ie8.js │ │ │ └── jquery.js │ │ ├── siblings/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── toggle_class/ │ │ │ ├── ie10.js │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ └── jquery.js │ │ ├── unwrap/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── val/ │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ └── wrap/ │ │ ├── jquery.js │ │ └── modern.js │ ├── events/ │ │ ├── alternatives.json │ │ ├── click/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── delegate/ │ │ │ ├── ie8.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── off/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ └── jquery.js │ │ ├── on/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── ready/ │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ ├── trigger_custom/ │ │ │ ├── alternatives.json │ │ │ ├── ie8.js │ │ │ ├── ie9.js │ │ │ ├── jquery.js │ │ │ └── modern.js │ │ └── trigger_native/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ ├── jquery.js │ │ └── modern.js │ └── utils/ │ ├── array_each/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ ├── jquery.js │ │ └── modern.js │ ├── bind/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ └── jquery.js │ ├── deep_extend/ │ │ ├── ie8.js │ │ ├── jquery.js │ │ └── modern.js │ ├── extend/ │ │ ├── alternatives.json │ │ ├── ie8.js │ │ ├── jquery.js │ │ └── modern.js │ ├── index_of/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ └── jquery.js │ ├── is_array/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ └── jquery.js │ ├── is_numeric/ │ │ ├── ie8.js │ │ ├── jquery.js │ │ └── modern.js │ ├── map/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ ├── jquery.js │ │ └── modern.js │ ├── now/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ └── jquery.js │ ├── object_each/ │ │ ├── ie8.js │ │ ├── jquery.js │ │ └── modern.js │ ├── parse_html/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ ├── jquery.js │ │ └── modern.js │ ├── parse_json/ │ │ ├── ie8.js │ │ └── jquery.js │ ├── slice/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ └── jquery.js │ ├── to_array/ │ │ ├── ie8.js │ │ ├── jquery.js │ │ └── modern.js │ ├── trim/ │ │ ├── ie8.js │ │ ├── ie9.js │ │ └── jquery.js │ └── type/ │ ├── ie8.js │ └── jquery.js ├── components/ │ └── CodeBlock.astro ├── env.d.ts ├── lib/ │ ├── comparisons.ts │ └── newest-engine.ts ├── pages/ │ └── index.astro └── utils/ ├── is-even.ts ├── throttle.ts └── title-case.ts ================================================ FILE CONTENTS ================================================ ================================================ FILE: .editorconfig ================================================ [*] end_of_line = lf insert_final_newline = true indent_style = space indent_size = 2 trim_trailing_whitespace = true [*.{js,css}] charset = utf-8 ================================================ FILE: .github/workflows/build.yml ================================================ on: push: branches: - dev pull_request: jobs: build: name: Build runs-on: ubuntu-latest steps: - uses: actions/checkout@v2 - name: Install, build and upload uses: withastro/action@v0 - name: Upload artifacts uses: actions/upload-pages-artifact@v1 with: path: dist publish: name: Publish needs: build runs-on: ubuntu-latest if: ${{ github.ref == 'refs/heads/dev' }} permissions: pages: write id-token: write environment: name: github-pages url: ${{ steps.deployment.outputs.page_url }} steps: - name: Deploy to GitHub Pages id: deployment uses: actions/deploy-pages@v1 ================================================ FILE: .gitignore ================================================ node_modules .DS_Store .vscode .idea # Generated files dist ================================================ FILE: .prettierignore ================================================ # Generated files dist/* ================================================ FILE: .prettierrc.json ================================================ { "singleQuote": true, "trailingComma": "none", "bracketSpacing": false, "plugins": ["prettier-plugin-astro"] } ================================================ FILE: LICENSE ================================================ Copyright (c) 2014 HubSpot, Inc. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. ================================================ FILE: README.md ================================================ # You Might Not Need jQuery ![Build Workflow](https://github.com/HubSpot/youmightnotneedjquery/actions/workflows/build.yml/badge.svg) A resource for doing things _au naturel_. ### [YouMightNotNeedjQuery.com](https://youmightnotneedjquery.com) ## Contributing To add a new section, just create a folder for it, and add `jquery.js`, and `ie8.js`, `ie9.js`, `ie10.js`, `ie11.js`, and `modern.js` (for Chrome/Safari/Firefox) as needed. For example, if you have `ie8.js` and `ie9.js`, the ie9 version will be shown to people looking for a solution that works in ie9, ie10, ie11, or modern JS. ## Building Building YMNNJQ requires Node.js 1. In the project directory, run `npm install` 1. To build the project and watch for changes, run `npm run dev`. 1. To build the project without watching for changes, use `npm run build`. ================================================ FILE: astro.config.ts ================================================ import {defineConfig} from 'astro/config'; import compress from 'astro-compress'; export default defineConfig({ integrations: [compress()] }); ================================================ FILE: package.json ================================================ { "private": true, "scripts": { "dev": "astro dev", "build": "astro build", "format": "prettier -w ." }, "devDependencies": { "@astrojs/prism": "^1.0.1", "@sindresorhus/class-names": "^2.0.0", "@types/node": "^18.7.16", "astro": "^1.1.7", "astro-compress": "^1.0.7", "modern-normalize": "^1.1.0", "prettier": "^2.7.1", "prettier-plugin-astro": "^0.5.4", "readfiletree": "^1.0.0", "sass": "^1.54.9", "sort-keys": "^5.0.0" } } ================================================ FILE: src/comparisons/ajax/alternatives.json ================================================ { "fetch": "https://github.com/github/fetch" } ================================================ FILE: src/comparisons/ajax/json/ie10.js ================================================ var request = new XMLHttpRequest(); request.open('GET', '/my/url', true); request.onload = function () { if (this.status >= 200 && this.status < 400) { // Success! var data = JSON.parse(this.response); } else { // We reached our target server, but it returned an error } }; request.onerror = function () { // There was a connection error of some sort }; request.send(); ================================================ FILE: src/comparisons/ajax/json/ie8.js ================================================ var request = new XMLHttpRequest(); request.open('GET', '/my/url', true); request.onreadystatechange = function () { if (this.readyState === 4) { if (this.status >= 200 && this.status < 400) { // Success! var data = JSON.parse(this.responseText); } else { // Error :( } } }; request.send(); request = null; ================================================ FILE: src/comparisons/ajax/json/ie9.js ================================================ var request = new XMLHttpRequest(); request.open('GET', '/my/url', true); request.onload = function () { if (request.status >= 200 && request.status < 400) { // Success! var data = JSON.parse(request.responseText); } else { // We reached our target server, but it returned an error } }; request.onerror = function () { // There was a connection error of some sort }; request.send(); ================================================ FILE: src/comparisons/ajax/json/jquery.js ================================================ $.getJSON('/my/url', function (data) {}); ================================================ FILE: src/comparisons/ajax/json/modern.js ================================================ const response = await fetch('/my/url'); const data = await response.json(); ================================================ FILE: src/comparisons/ajax/load/ie8.js ================================================ function load(selector, path) { var request = new XMLHttpRequest(); request.open('GET', path, true); request.onreadystatechange = function () { if (this.readyState === 4) { if (this.status >= 200 && this.status < 400) { // Success! var elements = document.querySelector(selector); for (var i = 0; i < elements.length; i++) { elements[i].innerHTML = this.responseText; } } else { // Error :( } } }; } load('#some.selector', '/path/to/template.html'); ================================================ FILE: src/comparisons/ajax/load/jquery.js ================================================ $('#some.selector').load('/path/to/template.html'); ================================================ FILE: src/comparisons/ajax/load/modern.js ================================================ const response = await fetch('/path/to/template.html'); const body = await response.text(); document.querySelector('#some.selector').innerHTML = body; ================================================ FILE: src/comparisons/ajax/post/ie8.js ================================================ var request = new XMLHttpRequest(); request.open('POST', '/my/url', true); request.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8' ); request.send(data); ================================================ FILE: src/comparisons/ajax/post/jquery.js ================================================ $.ajax({ type: 'POST', url: '/my/url', data: data }); ================================================ FILE: src/comparisons/ajax/post/modern.js ================================================ await fetch('/my/url', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(data) }); ================================================ FILE: src/comparisons/ajax/request/ie8.js ================================================ function request(success, error) { var request = new XMLHttpRequest(); request.open('GET', '/my/url', true); request.onreadystatechange = function () { if (this.readyState === 4) { if (this.status >= 200 && this.status < 400) { // Success! If you expect this to be JSON, use JSON.parse! success(this.responseText, this.status); } else { error(); } } }; request.send(); } ================================================ FILE: src/comparisons/ajax/request/ie9.js ================================================ function request(success, error) { var request = new XMLHttpRequest(); request.open('GET', '/my/url', true); request.onload = function () { if (this.status >= 200 && this.status < 400) { // Success! If you expect this to be JSON, use JSON.parse! success(this.responseText, this.status); } else { // We reached our target server, but it returned an error error(); } }; request.onerror = function () { error(); }; request.send(); } ================================================ FILE: src/comparisons/ajax/request/jquery.js ================================================ $.ajax({ type: 'GET', url: '/my/url', success: function (resp) {}, error: function () {} }); ================================================ FILE: src/comparisons/ajax/request/modern.js ================================================ const response = await fetch('/my/url'); if (!response.ok) { } const body = await response.text(); ================================================ FILE: src/comparisons/effects/alternatives.json ================================================ { "animate.css": "https://animate.style", "move.js": "https://github.com/visionmedia/move.js", "velocity.js": "https://julian.com/research/velocity/" } ================================================ FILE: src/comparisons/effects/fade_in/ie10.css ================================================ .show { transition: opacity 400ms; } .hide { opacity: 0; } ================================================ FILE: src/comparisons/effects/fade_in/ie10.js ================================================ el.classList.add('show'); el.classList.remove('hide'); ================================================ FILE: src/comparisons/effects/fade_in/ie8.js ================================================ function fadeIn(el, speed = 400) { var opacity = 0; el.style.opacity = 0; el.style.filter = ''; var last = +new Date(); var tick = function () { opacity += (new Date() - last) / speed; if (opacity > 1) opacity = 1; el.style.opacity = opacity; el.style.filter = 'alpha(opacity=' + (100 * opacity || 0) + ')'; last = +new Date(); if (opacity < 1) { (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16); } }; tick(); } fadeIn(el); ================================================ FILE: src/comparisons/effects/fade_in/ie9.js ================================================ function fadeIn(el, speed = 400) { el.style.opacity = 0; var last = +new Date(); var tick = function () { el.style.opacity = +el.style.opacity + (new Date() - last) / speed; if (opacity > 1) opacity = 1; last = +new Date(); if (+el.style.opacity < 1) { (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16); } }; tick(); } fadeIn(el); ================================================ FILE: src/comparisons/effects/fade_in/jquery.js ================================================ $(el).fadeIn(); ================================================ FILE: src/comparisons/effects/fade_in/modern.css ================================================ .show { transition: opacity 400ms; } .hide { opacity: 0; } ================================================ FILE: src/comparisons/effects/fade_in/modern.js ================================================ el.classList.replace('hide', 'show'); ================================================ FILE: src/comparisons/effects/fade_out/ie10.css ================================================ .show { opacity: 1; } .hide { opacity: 0; transition: opacity 400ms; } ================================================ FILE: src/comparisons/effects/fade_out/ie10.js ================================================ el.classList.add('hide'); el.classList.remove('show'); ================================================ FILE: src/comparisons/effects/fade_out/ie8.js ================================================ function fadeOut(el, speed = 400) { var opacity = 1; el.style.opacity = 1; el.style.filter = ''; var last = +new Date(); var tick = function () { opacity -= (new Date() - last) / speed; if (opacity < 0) opacity = 0; el.style.opacity = opacity; el.style.filter = 'alpha(opacity=' + 100 * opacity + ')'; last = +new Date(); if (opacity > 0) { (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16); } }; tick(); } fadeOut(el); ================================================ FILE: src/comparisons/effects/fade_out/ie9.js ================================================ function fadeOut(el, speed = 400) { el.style.opacity = 1; var last = +new Date(); var tick = function () { el.style.opacity = +el.style.opacity - (new Date() - last) / speed; if (opacity < 0) opacity = 0; last = +new Date(); if (+el.style.opacity > 0) { (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16); } }; tick(); } fadeOut(el); ================================================ FILE: src/comparisons/effects/fade_out/jquery.js ================================================ $(el).fadeOut(); ================================================ FILE: src/comparisons/effects/fade_out/modern.css ================================================ .show { opacity: 1; } .hide { opacity: 0; transition: opacity 400ms; } ================================================ FILE: src/comparisons/effects/fade_out/modern.js ================================================ el.classList.replace('show', 'hide'); ================================================ FILE: src/comparisons/effects/hide/ie8.js ================================================ el.style.display = 'none'; ================================================ FILE: src/comparisons/effects/hide/jquery.js ================================================ $(el).hide(); ================================================ FILE: src/comparisons/effects/show/ie8.js ================================================ el.style.display = ''; ================================================ FILE: src/comparisons/effects/show/jquery.js ================================================ $(el).show(); ================================================ FILE: src/comparisons/effects/toggle/ie8.js ================================================ function toggle(el) { if (el.style.display == 'none') { el.style.display = ''; } else { el.style.display = 'none'; } } ================================================ FILE: src/comparisons/effects/toggle/jquery.js ================================================ $(el).toggle(); ================================================ FILE: src/comparisons/elements/add_class/ie10.js ================================================ el.classList.add(className); ================================================ FILE: src/comparisons/elements/add_class/ie8.js ================================================ if (el.classList) { el.classList.add(className); } else { var current = el.className, found = false; var all = current.split(' '); for (var i = 0; i < all.length, !found; i++) found = all[i] === className; if (!found) { if (current === '') el.className = className; else el.className += ' ' + className; } } ================================================ FILE: src/comparisons/elements/add_class/jquery.js ================================================ $(el).addClass(className); ================================================ FILE: src/comparisons/elements/after/ie8.js ================================================ target.insertAdjacentElement('afterend', element); ================================================ FILE: src/comparisons/elements/after/jquery.js ================================================ $(target).after(element); ================================================ FILE: src/comparisons/elements/after/modern.js ================================================ target.after(element); ================================================ FILE: src/comparisons/elements/alternatives.json ================================================ { "bonzo": "https://github.com/ded/bonzo", "$dom": "https://github.com/julienw/dollardom" } ================================================ FILE: src/comparisons/elements/append/ie8.js ================================================ parent.appendChild(el); ================================================ FILE: src/comparisons/elements/append/jquery.js ================================================ $(parent).append(el); ================================================ FILE: src/comparisons/elements/append/modern.js ================================================ parent.append(el); ================================================ FILE: src/comparisons/elements/append_to/ie8.js ================================================ parent.appendChild(el); ================================================ FILE: src/comparisons/elements/append_to/jquery.js ================================================ $(el).appendTo(parent); ================================================ FILE: src/comparisons/elements/append_to/modern.js ================================================ parent.append(el); ================================================ FILE: src/comparisons/elements/before/ie8.js ================================================ target.insertAdjacentElement('beforebegin', element); ================================================ FILE: src/comparisons/elements/before/jquery.js ================================================ $(target).before(element); ================================================ FILE: src/comparisons/elements/before/modern.js ================================================ target.before(el); ================================================ FILE: src/comparisons/elements/children/ie8.js ================================================ var children = []; for (var i = el.children.length; i--; ) { // Skip comment nodes on IE8 if (el.children[i].nodeType != 8) children.unshift(el.children[i]); } ================================================ FILE: src/comparisons/elements/children/ie9.js ================================================ el.children; ================================================ FILE: src/comparisons/elements/children/jquery.js ================================================ $(el).children(); ================================================ FILE: src/comparisons/elements/clone/ie8.js ================================================ el.cloneNode(true); ================================================ FILE: src/comparisons/elements/clone/jquery.js ================================================ $(el).clone(); ================================================ FILE: src/comparisons/elements/closest/ie10.js ================================================ el.closest(sel); ================================================ FILE: src/comparisons/elements/closest/ie8.js ================================================ function closest(el, sel) { Element.prototype.matches || (Element.prototype.matches = Element.prototype.matchesSelector || Element.prototype.mozMatchesSelector || Element.prototype.msMatchesSelector || Element.prototype.oMatchesSelector || Element.prototype.webkitMatchesSelector || function (b) { b = (this.document || this.ownerDocument).querySelectorAll(b); for (var a = b.length; 0 <= --a && b.item(a) !== this; ); return -1 < a; }); Element.prototype.closest || (Element.prototype.closest = function (b) { var a = this; do { if (a.matches(b)) return a; a = a.parentElement || a.parentNode; } while (null !== a && 1 === a.nodeType); return null; }); return el.closest(sel); } closest(el, sel); ================================================ FILE: src/comparisons/elements/closest/ie9.js ================================================ function closest(el, sel) { Element.prototype.matches || (Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector); Element.prototype.closest || (Element.prototype.closest = function (c) { var a = this; do { if (a.matches(c)) return a; a = a.parentElement || a.parentNode; } while (null !== a && 1 === a.nodeType); return null; }); return el.closest(sel); } closest(el, sel); ================================================ FILE: src/comparisons/elements/closest/jquery.js ================================================ $(el).closest(sel); ================================================ FILE: src/comparisons/elements/contains/ie8.js ================================================ el !== child && el.contains(child); ================================================ FILE: src/comparisons/elements/contains/jquery.js ================================================ $.contains(el, child); ================================================ FILE: src/comparisons/elements/contains/modern.js ================================================ node.contains(anotherNode); ================================================ FILE: src/comparisons/elements/contains_selector/alternatives.json ================================================ { "xpath": "https://www.w3schools.com/xml/xpath_intro.asp" } ================================================ FILE: src/comparisons/elements/contains_selector/jquery.js ================================================ $("div:contains('my text')"); ================================================ FILE: src/comparisons/elements/contains_selector/modern.js ================================================ [...document.querySelectorAll('div')].filter((el) => el.textContent.includes('my text') ); ================================================ FILE: src/comparisons/elements/contents/jquery.js ================================================ $(el).contents(); ================================================ FILE: src/comparisons/elements/contents/modern.js ================================================ el.childNodes; ================================================ FILE: src/comparisons/elements/create_elements/ie8.js ================================================ function generateElements(html) { var div = document.createElement('div'); div.innerHTML = html; return div.children; } generateElements('
Hello World!
'); ================================================ FILE: src/comparisons/elements/create_elements/jquery.js ================================================ $('
Hello World!
'); ================================================ FILE: src/comparisons/elements/create_elements/modern.js ================================================ function generateElements(html) { const template = document.createElement('template'); template.innerHTML = html.trim(); return template.content.children; } generateElements('
Hello World!
'); ================================================ FILE: src/comparisons/elements/each/ie8.js ================================================ function forEachElement(selector, fn) { var elements = document.querySelectorAll(selector); for (var i = 0; i < elements.length; i++) fn(elements[i], i); } forEachElement(selector, function (el, i) {}); ================================================ FILE: src/comparisons/elements/each/ie9.js ================================================ var elements = document.querySelectorAll(selector); Array.prototype.forEach.call(elements, function (el, i) {}); ================================================ FILE: src/comparisons/elements/each/jquery.js ================================================ $(selector).each(function (i, el) {}); ================================================ FILE: src/comparisons/elements/each/modern.js ================================================ document.querySelectorAll(selector).forEach((el, i) => {}); ================================================ FILE: src/comparisons/elements/empty/ie8.js ================================================ while (el.firstChild) el.removeChild(el.firstChild); ================================================ FILE: src/comparisons/elements/empty/jquery.js ================================================ $(el).empty(); ================================================ FILE: src/comparisons/elements/empty/modern.js ================================================ el.replaceChildren(); ================================================ FILE: src/comparisons/elements/filter/ie8.js ================================================ function filter(selector, filterFn) { var elements = document.querySelectorAll(selector); var out = []; for (var i = elements.length; i--; ) { if (filterFn(elements[i])) out.unshift(elements[i]); } return out; } filter(selector, filterFn); ================================================ FILE: src/comparisons/elements/filter/ie9.js ================================================ Array.prototype.filter.call(document.querySelectorAll(selector), filterFn); ================================================ FILE: src/comparisons/elements/filter/jquery.js ================================================ $(selector).filter(filterFn); ================================================ FILE: src/comparisons/elements/filter/modern.js ================================================ [...document.querySelectorAll(selector)].filter(filterFn); ================================================ FILE: src/comparisons/elements/find_children/ie8.js ================================================ el.querySelectorAll(selector); ================================================ FILE: src/comparisons/elements/find_children/jquery.js ================================================ $(el).find(selector); ================================================ FILE: src/comparisons/elements/find_children/modern.js ================================================ // For direct descendants only, see https://developer.mozilla.org/en-US/docs/Web/API/Element/querySelectorAll#user_notes el.querySelectorAll(`:scope ${selector}`); ================================================ FILE: src/comparisons/elements/find_elements/alternatives.json ================================================ { "qwery": "https://github.com/ded/qwery", "sizzle": "https://sizzlejs.com/" } ================================================ FILE: src/comparisons/elements/find_elements/ie8.js ================================================ document.querySelectorAll('.my #awesome selector'); ================================================ FILE: src/comparisons/elements/find_elements/jquery.js ================================================ $('.my #awesome selector'); ================================================ FILE: src/comparisons/elements/find_selector/ie8.js ================================================ !!el.querySelector(selector); ================================================ FILE: src/comparisons/elements/find_selector/jquery.js ================================================ $(el).find(selector).length; ================================================ FILE: src/comparisons/elements/first/ie8.js ================================================ document.querySelector(el); ================================================ FILE: src/comparisons/elements/first/jquery.js ================================================ $(el).first(); ================================================ FILE: src/comparisons/elements/get_attributes/ie8.js ================================================ el.getAttribute('tabindex'); ================================================ FILE: src/comparisons/elements/get_attributes/jquery.js ================================================ $(el).attr('tabindex'); ================================================ FILE: src/comparisons/elements/get_height/ie8.js ================================================ function getHeight(el) { var d = /^\d+(px)?$/i; if (window.getComputedStyle) el = parseFloat(getComputedStyle(el, null).height.replace('px', '')); else { var c = el.currentStyle.height; if (d.test(c)) el = parseInt(c); else { d = el.style.left; var e = el.runtimeStyle.left; el.runtimeStyle.left = el.currentStyle.left; el.style.left = c || 0; c = el.style.pixelLeft; el.style.left = d; el.runtimeStyle.left = e; el = c; } } return el; } getHeight(el); ================================================ FILE: src/comparisons/elements/get_height/ie9.js ================================================ parseFloat(getComputedStyle(el, null).height.replace('px', '')); ================================================ FILE: src/comparisons/elements/get_height/jquery.js ================================================ $(el).height(); ================================================ FILE: src/comparisons/elements/get_height/modern.js ================================================ el.getBoundingClientRect().height; ================================================ FILE: src/comparisons/elements/get_html/ie8.js ================================================ el.innerHTML; ================================================ FILE: src/comparisons/elements/get_html/jquery.js ================================================ $(el).html(); ================================================ FILE: src/comparisons/elements/get_outer_html/ie8.js ================================================ el.outerHTML; ================================================ FILE: src/comparisons/elements/get_outer_html/jquery.js ================================================ $(el).prop('outerHTML'); ================================================ FILE: src/comparisons/elements/get_style/ie8.js ================================================ // Varies based on the properties being retrieved, some can be retrieved from el.currentStyle // https://github.com/jonathantneal/Polyfills-for-IE8/blob/master/getComputedStyle.js ================================================ FILE: src/comparisons/elements/get_style/ie9.js ================================================ getComputedStyle(el)[ruleName]; ================================================ FILE: src/comparisons/elements/get_style/jquery.js ================================================ $(el).css(ruleName); ================================================ FILE: src/comparisons/elements/get_text/ie8.js ================================================ el.textContent || el.innerText; ================================================ FILE: src/comparisons/elements/get_text/ie9.js ================================================ el.textContent; ================================================ FILE: src/comparisons/elements/get_text/jquery.js ================================================ $(el).text(); ================================================ FILE: src/comparisons/elements/get_width/ie8.js ================================================ function getWidth(el) { var d = /^\d+(px)?$/i; if (window.getComputedStyle) el = parseFloat(getComputedStyle(el, null).width.replace('px', '')); else { var c = el.currentStyle.width; if (d.test(c)) el = parseInt(c); else { d = el.style.left; var e = el.runtimeStyle.left; el.runtimeStyle.left = el.currentStyle.left; el.style.left = c || 0; c = el.style.pixelLeft; el.style.left = d; el.runtimeStyle.left = e; el = c; } } return el; } getWidth(el); ================================================ FILE: src/comparisons/elements/get_width/ie9.js ================================================ parseFloat(getComputedStyle(el, null).width.replace('px', '')); ================================================ FILE: src/comparisons/elements/get_width/jquery.js ================================================ $(el).width(); ================================================ FILE: src/comparisons/elements/get_width/modern.js ================================================ el.getBoundingClientRect().width; ================================================ FILE: src/comparisons/elements/has_class/ie10.js ================================================ el.classList.contains(className); ================================================ FILE: src/comparisons/elements/has_class/ie8.js ================================================ if (el.classList) el.classList.contains(className); else new RegExp('(^| )' + className + '( |$)', 'gi').test(el.className); ================================================ FILE: src/comparisons/elements/has_class/jquery.js ================================================ $(el).hasClass(className); ================================================ FILE: src/comparisons/elements/index/ie8.js ================================================ function index(el) { if (!el) return -1; var i = 0; while (el) { el = el.previousSibling; if (el && el.nodeType === 1) i++; } return i; } ================================================ FILE: src/comparisons/elements/index/ie9.js ================================================ function index(el) { if (!el) return -1; var i = 0; while ((el = el.previousElementSibling)) { i++; } return i; } ================================================ FILE: src/comparisons/elements/index/jquery.js ================================================ $(el).index(); ================================================ FILE: src/comparisons/elements/index/modern.js ================================================ [...el.parentNode.children].indexOf(el); ================================================ FILE: src/comparisons/elements/inner_height/jquery.js ================================================ $(el).innerHeight(); $(el).innerHeight(150); ================================================ FILE: src/comparisons/elements/inner_height/modern.js ================================================ function innerHeight(el, value) { if (value === undefined) { return el.clientHeight; } else { el.style.height = value; } } innerHeight(el); innerHeight(el, 150); ================================================ FILE: src/comparisons/elements/inner_width/jquery.js ================================================ $(el).innerWidth(); $(el).innerWidth(150); ================================================ FILE: src/comparisons/elements/inner_width/modern.js ================================================ function innerWidth(el, value) { if (value === undefined) { return el.clientWidth; } else { el.style.width = value; } } innerWidth(el); innerWidth(el, 150); ================================================ FILE: src/comparisons/elements/is_hidden/jquery.js ================================================ $(el).is(':hidden'); ================================================ FILE: src/comparisons/elements/is_hidden/modern.js ================================================ function isHidden(el) { return !(el.offsetWidth || el.offsetHeight || el.getClientRects().length); } ================================================ FILE: src/comparisons/elements/is_visible/jquery.js ================================================ $(el).is(':visible'); ================================================ FILE: src/comparisons/elements/is_visible/modern.js ================================================ function isVisible(el) { return !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length); } ================================================ FILE: src/comparisons/elements/last/ie8.js ================================================ var els = document.querySelectorAll(el); els[els.length - 1]; ================================================ FILE: src/comparisons/elements/last/jquery.js ================================================ $(el).last(); ================================================ FILE: src/comparisons/elements/last/modern.js ================================================ [...document.querySelectorAll(el)].at(-1); ================================================ FILE: src/comparisons/elements/matches/ie8.js ================================================ el === otherEl; ================================================ FILE: src/comparisons/elements/matches/jquery.js ================================================ $(el).is($(otherEl)); ================================================ FILE: src/comparisons/elements/matches_selector/ie8.js ================================================ var matches = function (el, selector) { var _matches = el.matches || el.matchesSelector || el.msMatchesSelector || el.mozMatchesSelector || el.webkitMatchesSelector || el.oMatchesSelector; if (_matches) { return _matches.call(el, selector); } else { if (el.parentNode === null) return false; var nodes = el.parentNode.querySelectorAll(selector); for (var i = nodes.length; i--; ) { if (nodes[i] === el) return true; } return false; } }; matches(el, '.my-class'); ================================================ FILE: src/comparisons/elements/matches_selector/ie9.js ================================================ var matches = function (el, selector) { return ( el.matches || el.matchesSelector || el.msMatchesSelector || el.mozMatchesSelector || el.webkitMatchesSelector || el.oMatchesSelector ).call(el, selector); }; matches(el, '.my-class'); ================================================ FILE: src/comparisons/elements/matches_selector/jquery.js ================================================ $(el).is('.my-class'); ================================================ FILE: src/comparisons/elements/matches_selector/modern.js ================================================ el.matches('.my-class'); ================================================ FILE: src/comparisons/elements/next/ie8.js ================================================ // nextSibling can include text nodes function nextElementSibling(el) { do { el = el.nextSibling; } while (el && el.nodeType !== 1); return el; } el.nextElementSibling || nextElementSibling(el); ================================================ FILE: src/comparisons/elements/next/ie9.js ================================================ el.nextElementSibling; ================================================ FILE: src/comparisons/elements/next/jquery.js ================================================ $(el).next(); ================================================ FILE: src/comparisons/elements/next/modern.js ================================================ function next(el, selector) { const nextEl = el.nextElementSibling; if (!selector || (nextEl && nextEl.matches(selector))) { return nextEl; } return null; } next(el); // Or, with an optional selector next(el, '.my-selector'); ================================================ FILE: src/comparisons/elements/offset/ie8.js ================================================ function offset(el) { var docElem = document.documentElement; var rect = el.getBoundingClientRect(); return { top: rect.top + (window.pageYOffset || docElem.scrollTop) - (docElem.clientTop || 0), left: rect.left + (window.pageXOffset || docElem.scrollLeft) - (docElem.clientLeft || 0) }; } ================================================ FILE: src/comparisons/elements/offset/ie9.js ================================================ function offset(el) { box = el.getBoundingClientRect(); docElem = document.documentElement; return { top: box.top + window.pageYOffset - docElem.clientTop, left: box.left + window.pageXOffset - docElem.clientLeft }; } ================================================ FILE: src/comparisons/elements/offset/jquery.js ================================================ $(el).offset(); ================================================ FILE: src/comparisons/elements/offset_parent/ie8.js ================================================ el.offsetParent || el; ================================================ FILE: src/comparisons/elements/offset_parent/jquery.js ================================================ $(el).offsetParent(); ================================================ FILE: src/comparisons/elements/outer_height/ie8.js ================================================ el.offsetHeight; ================================================ FILE: src/comparisons/elements/outer_height/jquery.js ================================================ $(el).outerHeight(); ================================================ FILE: src/comparisons/elements/outer_height_with_margin/ie8.js ================================================ function outerHeight(el) { var height = el.offsetHeight; var style = el.currentStyle || getComputedStyle(el); height += parseFloat(style.marginTop) + parseFloat(style.marginBottom); return height; } outerHeight(el); ================================================ FILE: src/comparisons/elements/outer_height_with_margin/ie9.js ================================================ function outerHeight(el) { var height = el.offsetHeight; var style = getComputedStyle(el); height += parseFloat(style.marginTop) + parseFloat(style.marginBottom); return height; } outerHeight(el); ================================================ FILE: src/comparisons/elements/outer_height_with_margin/jquery.js ================================================ $(el).outerHeight(true); ================================================ FILE: src/comparisons/elements/outer_height_with_margin/modern.js ================================================ function outerHeight(el) { const style = getComputedStyle(el); return ( el.getBoundingClientRect().height + parseFloat(style.marginTop) + parseFloat(style.marginBottom) ); } outerHeight(el); ================================================ FILE: src/comparisons/elements/outer_width/ie8.js ================================================ el.offsetWidth; ================================================ FILE: src/comparisons/elements/outer_width/jquery.js ================================================ $(el).outerWidth(); ================================================ FILE: src/comparisons/elements/outer_width_with_margin/ie8.js ================================================ function outerWidth(el) { var width = el.offsetWidth; var style = el.currentStyle || getComputedStyle(el); width += parseFloat(style.marginLeft) + parseFloat(style.marginRight); return width; } outerWidth(el); ================================================ FILE: src/comparisons/elements/outer_width_with_margin/ie9.js ================================================ function outerWidth(el) { var width = el.offsetWidth; var style = getComputedStyle(el); width += parseFloat(style.marginLeft) + parseFloat(style.marginRight); return width; } outerWidth(el); ================================================ FILE: src/comparisons/elements/outer_width_with_margin/jquery.js ================================================ $(el).outerWidth(true); ================================================ FILE: src/comparisons/elements/outer_width_with_margin/modern.js ================================================ function outerWidth(el) { const style = getComputedStyle(el); return ( el.getBoundingClientRect().width + parseFloat(style.marginLeft) + parseFloat(style.marginRight) ); } outerWidth(el); ================================================ FILE: src/comparisons/elements/parent/ie8.js ================================================ el.parentNode; ================================================ FILE: src/comparisons/elements/parent/jquery.js ================================================ $(el).parent(); ================================================ FILE: src/comparisons/elements/parents/ie9.js ================================================ function parents(el, selector) { var parents = []; while ((el = el.parentNode) && el !== document) { // See "Matches Selector" above if (!selector || matches(el, selector)) parents.push(el); } return parents; } ================================================ FILE: src/comparisons/elements/parents/jquery.js ================================================ $(el).parents(selector); ================================================ FILE: src/comparisons/elements/parents/modern.js ================================================ function parents(el, selector) { const parents = []; while ((el = el.parentNode) && el !== document) { if (!selector || el.matches(selector)) parents.push(el); } return parents; } ================================================ FILE: src/comparisons/elements/position/ie8.js ================================================ function position(el) { var box = el.getBoundingClientRect(); var docElem = document.documentElement; var marginLeft = 0; var marginTop = 0; if (typeof getComputedStyle === 'function') { var style = window.getComputedStyle(el); marginLeft = parseInt(style.marginLeft, 10); marginTop = parseInt(style.marginTop, 10); } else if (el.currentStyle) { marginLeft = el.currentStyle['marginLeft'] ? parseInt(el.currentStyle['marginLeft'], 10) : 0; marginTop = el.currentStyle['marginTop'] ? parseInt(el.currentStyle['marginTop'], 10) : 0; } return { top: box.top + (window.pageYOffset || docElem.scrollTop) - marginTop, left: box.left + (window.pageXOffset || docElem.scrollLeft) - marginLeft }; } ================================================ FILE: src/comparisons/elements/position/jquery.js ================================================ $(el).position(); ================================================ FILE: src/comparisons/elements/position/modern.js ================================================ function position(el) { const {top, left} = el.getBoundingClientRect(); const {marginTop, marginLeft} = getComputedStyle(el); return { top: top - parseInt(marginTop, 10), left: left - parseInt(marginLeft, 10) }; } ================================================ FILE: src/comparisons/elements/position_relative_to_viewport/ie8.js ================================================ el.getBoundingClientRect(); ================================================ FILE: src/comparisons/elements/position_relative_to_viewport/jquery.js ================================================ function offset(el) { var offset = $(el).offset(); return { top: offset.top - document.body.scrollTop, left: offset.left - document.body.scrollLeft }; } ================================================ FILE: src/comparisons/elements/prepend/ie8.js ================================================ parent.insertBefore(el, parent.firstChild); ================================================ FILE: src/comparisons/elements/prepend/jquery.js ================================================ $(parent).prepend(el); ================================================ FILE: src/comparisons/elements/prepend/modern.js ================================================ parent.prepend(el); ================================================ FILE: src/comparisons/elements/prev/ie8.js ================================================ // prevSibling can include text nodes function previousElementSibling(el) { do { el = el.previousSibling; } while (el && el.nodeType !== 1); return el; } el.previousElementSibling || previousElementSibling(el); ================================================ FILE: src/comparisons/elements/prev/ie9.js ================================================ el.previousElementSibling; ================================================ FILE: src/comparisons/elements/prev/jquery.js ================================================ $(el).prev(); // Or, with an optional selector $(el).prev('.my-selector'); ================================================ FILE: src/comparisons/elements/prev/modern.js ================================================ function prev(el, selector) { const prevEl = el.previousElementSibling; if (!selector || (prevEl && prevEl.matches(selector))) { return prevEl; } return null; } prev(el); // Or, with an optional selector prev(el, '.my-selector'); ================================================ FILE: src/comparisons/elements/remove/ie8.js ================================================ if (el.parentNode !== null) { el.parentNode.removeChild(el); } ================================================ FILE: src/comparisons/elements/remove/jquery.js ================================================ $(el).remove(); // multiple elements $(selector).remove(); ================================================ FILE: src/comparisons/elements/remove/modern.js ================================================ el.remove(); // multiple elements for (const el of document.querySelectorAll(selector)) { el.remove(); } ================================================ FILE: src/comparisons/elements/remove_attributes/ie8.js ================================================ el.removeAttribute('tabindex'); ================================================ FILE: src/comparisons/elements/remove_attributes/jquery.js ================================================ $(el).removeAttr('tabindex'); ================================================ FILE: src/comparisons/elements/remove_class/ie10.js ================================================ el.classList.remove(className); ================================================ FILE: src/comparisons/elements/remove_class/ie8.js ================================================ function removeClass(el, className) { var classes = className.split(' '); for (var i = 0; i < classes.length; i++) { if (el.classList) { el.classList.remove(classes[i]); } else { el.className = el.className .replace(new RegExp('(?:^|\\s)' + classes[i] + '(?:\\s|$)'), ' ') .replace(new RegExp(/^\s+|\s+$/g), ''); } } } ================================================ FILE: src/comparisons/elements/remove_class/jquery.js ================================================ $(el).removeClass(className); ================================================ FILE: src/comparisons/elements/replace_from_html/ie8.js ================================================ el.outerHTML = string; ================================================ FILE: src/comparisons/elements/replace_from_html/jquery.js ================================================ $(el).replaceWith(string); ================================================ FILE: src/comparisons/elements/scroll_left/jquery.js ================================================ $(window).scrollLeft(); ================================================ FILE: src/comparisons/elements/scroll_left/modern.js ================================================ function scrollLeft(el, value) { var win; if (el.window === el) { win = el; } else if (el.nodeType === 9) { win = el.defaultView; } if (value === undefined) { return win ? win.pageXOffset : el.scrollLeft; } if (win) { win.scrollTo(value, win.pageYOffset); } else { el.scrollLeft = value; } } ================================================ FILE: src/comparisons/elements/scroll_top/jquery.js ================================================ $(window).scrollTop(); ================================================ FILE: src/comparisons/elements/scroll_top/modern.js ================================================ function scrollTop(el, value) { var win; if (el.window === el) { win = el; } else if (el.nodeType === 9) { win = el.defaultView; } if (value === undefined) { return win ? win.pageYOffset : el.scrollTop; } if (win) { win.scrollTo(win.pageXOffset, value); } else { el.scrollTop = value; } } ================================================ FILE: src/comparisons/elements/serialize/jquery.js ================================================ $(formElement).serialize(); ================================================ FILE: src/comparisons/elements/serialize/modern.js ================================================ new URLSearchParams(new FormData(formElement)).toString(); ================================================ FILE: src/comparisons/elements/set_attributes/ie8.js ================================================ el.setAttribute('tabindex', 3); ================================================ FILE: src/comparisons/elements/set_attributes/jquery.js ================================================ $(el).attr('tabindex', 3); ================================================ FILE: src/comparisons/elements/set_height/ie8.js ================================================ function setHeight(el, val) { if (typeof val === 'function') val = val(); if (typeof val === 'string') el.style.height = val; else el.style.height = val + 'px'; } setHeight(el, val); ================================================ FILE: src/comparisons/elements/set_height/jquery.js ================================================ $(el).height(val); ================================================ FILE: src/comparisons/elements/set_html/ie8.js ================================================ el.innerHTML = string; ================================================ FILE: src/comparisons/elements/set_html/jquery.js ================================================ $(el).html(string); ================================================ FILE: src/comparisons/elements/set_style/ie8.js ================================================ // Use a class if possible el.style.borderWidth = '20px'; ================================================ FILE: src/comparisons/elements/set_style/jquery.js ================================================ $(el).css('border-width', '20px'); ================================================ FILE: src/comparisons/elements/set_text/ie8.js ================================================ if (el.textContent !== undefined) el.textContent = string; else el.innerText = string; ================================================ FILE: src/comparisons/elements/set_text/ie9.js ================================================ el.textContent = string; ================================================ FILE: src/comparisons/elements/set_text/jquery.js ================================================ $(el).text(string); ================================================ FILE: src/comparisons/elements/set_width/ie8.js ================================================ function setWidth(el, val) { if (typeof val === 'function') val = val(); if (typeof val === 'string') el.style.width = val; else el.style.width = val + 'px'; } setWidth(el, val); ================================================ FILE: src/comparisons/elements/set_width/jquery.js ================================================ $(el).width(val); ================================================ FILE: src/comparisons/elements/siblings/ie8.js ================================================ var siblings = function (el) { if (el.parentNode === null) return []; var siblingElements = Array.prototype.slice.call(el.parentNode.children); for (var i = siblingElements.length; i--; ) { if (siblingElements[i] === el) { return siblingElements.splice(i, 1); } } return siblingElements; }; siblings(el); ================================================ FILE: src/comparisons/elements/siblings/ie9.js ================================================ var siblings = function (el) { if (el.parentNode === null) return []; return Array.prototype.filter.call(el.parentNode.children, function (child) { return child !== el; }); }; siblings(el); ================================================ FILE: src/comparisons/elements/siblings/jquery.js ================================================ $(el).siblings(); ================================================ FILE: src/comparisons/elements/siblings/modern.js ================================================ [...el.parentNode.children].filter((child) => child !== el); ================================================ FILE: src/comparisons/elements/toggle_class/ie10.js ================================================ el.classList.toggle(className); ================================================ FILE: src/comparisons/elements/toggle_class/ie8.js ================================================ if (el.classList) { el.classList.toggle(className); } else { var classes = el.className.split(' '); var existingIndex = -1; for (var i = classes.length; i--; ) { if (classes[i] === className) existingIndex = i; } if (existingIndex >= 0) classes.splice(existingIndex, 1); else classes.push(className); el.className = classes.join(' '); } ================================================ FILE: src/comparisons/elements/toggle_class/ie9.js ================================================ if (el.classList) { el.classList.toggle(className); } else { var classes = el.className.split(' '); var existingIndex = classes.indexOf(className); if (existingIndex >= 0) classes.splice(existingIndex, 1); else classes.push(className); el.className = classes.join(' '); } ================================================ FILE: src/comparisons/elements/toggle_class/jquery.js ================================================ $(el).toggleClass(className); ================================================ FILE: src/comparisons/elements/unwrap/jquery.js ================================================ $(el).unwrap(); ================================================ FILE: src/comparisons/elements/unwrap/modern.js ================================================ el.replaceWith(...el.childNodes); ================================================ FILE: src/comparisons/elements/val/jquery.js ================================================ $(el).val(); ================================================ FILE: src/comparisons/elements/val/modern.js ================================================ function val(el) { if (el.options && el.multiple) { return el.options .filter((option) => option.selected) .map((option) => option.value); } else { return el.value; } } ================================================ FILE: src/comparisons/elements/wrap/jquery.js ================================================ el.wrap('
'); ================================================ FILE: src/comparisons/elements/wrap/modern.js ================================================ function wrap(el) { const wrappingElement = document.createElement('div'); el.replaceWith(wrappingElement); wrappingElement.appendChild(el); } ================================================ FILE: src/comparisons/events/alternatives.json ================================================ { "ftdomdelegate": "https://github.com/ftlabs/ftdomdelegate", "defer": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-defer", "modules": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules" } ================================================ FILE: src/comparisons/events/click/ie8.js ================================================ var onClick = function (element, handler) { if (element.addEventListener) { element.addEventListener('click', handler, false); } else { element.attachEvent('onclick', handler); } }; onClick(el, function () {}); ================================================ FILE: src/comparisons/events/click/ie9.js ================================================ el.addEventListener('click', function () {}); ================================================ FILE: src/comparisons/events/click/jquery.js ================================================ $(el).click(function () {}); ================================================ FILE: src/comparisons/events/click/modern.js ================================================ el.addEventListener('click', () => {}); ================================================ FILE: src/comparisons/events/delegate/ie8.js ================================================ document.addEventListener( eventName, function (e) { // loop parent nodes from the target to the delegation node for ( var target = e.target; target && target != this; target = target.parentNode ) { if (target.matches(elementSelector)) { handler.call(target, e); break; } } }, false ); ================================================ FILE: src/comparisons/events/delegate/jquery.js ================================================ $(document).on(eventName, elementSelector, handler); ================================================ FILE: src/comparisons/events/delegate/modern.js ================================================ document.addEventListener(eventName, (event) => { if (event.target.closest(elementSelector)) { handler.call(event.target, event); } }); ================================================ FILE: src/comparisons/events/off/ie8.js ================================================ function removeEventListener(el, eventName, handler) { if (el.removeEventListener) el.removeEventListener(eventName, handler); else el.detachEvent('on' + eventName, handler); } removeEventListener(el, eventName, handler); ================================================ FILE: src/comparisons/events/off/ie9.js ================================================ el.removeEventListener(eventName, eventHandler); ================================================ FILE: src/comparisons/events/off/jquery.js ================================================ $(el).off(eventName, eventHandler); ================================================ FILE: src/comparisons/events/on/ie8.js ================================================ function addEventListener(el, eventName, handler) { if (el.addEventListener) { el.addEventListener(eventName, handler); return handler; } else { var wrappedHandler = function (event) { handler.call(el, event); }; el.attachEvent('on' + eventName, wrappedHandler); return wrappedHandler; } } // Use the return value to remove that event listener, see #off var handlerToRemove = addEventListener(el, eventName, handler); ================================================ FILE: src/comparisons/events/on/ie9.js ================================================ function addEventListener(el, eventName, eventHandler, selector) { if (selector) { var wrappedHandler = function (e) { if (e.target && e.target.matches(selector)) { eventHandler(e); } }; el.addEventListener(eventName, wrappedHandler); return wrappedHandler; } else { el.addEventListener(eventName, eventHandler); return eventHandler; } } // Use the return value to remove that event listener, see #off addEventListener(el, eventName, eventHandler); // Or when you want to delegate event handling addEventListener(el, eventName, eventHandler, selector); ================================================ FILE: src/comparisons/events/on/jquery.js ================================================ $(el).on(eventName, eventHandler); // Or when you want to delegate event handling $(el).on(eventName, selector, eventHandler); ================================================ FILE: src/comparisons/events/on/modern.js ================================================ function addEventListener(el, eventName, eventHandler, selector) { if (selector) { const wrappedHandler = (e) => { if (!e.target) return; const el = e.target.closest(selector); if (el) { eventHandler.call(el, e); } }; el.addEventListener(eventName, wrappedHandler); return wrappedHandler; } else { const wrappedHandler = (e) => { eventHandler.call(el, e); }; el.addEventListener(eventName, wrappedHandler); return wrappedHandler; } } // Use the return value to remove that event listener, see #off addEventListener(el, eventName, eventHandler); // Or when you want to delegate event handling addEventListener(el, eventName, eventHandler, selector); ================================================ FILE: src/comparisons/events/ready/ie8.js ================================================ function ready(fn) { if (document.readyState != 'loading') { fn(); } else if (document.addEventListener) { document.addEventListener('DOMContentLoaded', fn); } else { document.attachEvent('onreadystatechange', function () { if (document.readyState != 'loading') fn(); }); } } ================================================ FILE: src/comparisons/events/ready/ie9.js ================================================ function ready(fn) { if ( document.attachEvent ? document.readyState === 'complete' : document.readyState !== 'loading' ) { fn(); } else { document.addEventListener('DOMContentLoaded', fn); } } ================================================ FILE: src/comparisons/events/ready/jquery.js ================================================ $(document).ready(function () {}); ================================================ FILE: src/comparisons/events/ready/modern.js ================================================ function ready(fn) { if (document.readyState !== 'loading') { fn(); } else { document.addEventListener('DOMContentLoaded', fn); } } ================================================ FILE: src/comparisons/events/trigger_custom/alternatives.json ================================================ { "EventEmitter": "https://github.com/Wolfy87/EventEmitter", "Vine": "https://github.com/arextar/Vine", "microevent": "https://github.com/jeromeetienne/microevent.js" } ================================================ FILE: src/comparisons/events/trigger_custom/ie8.js ================================================ // Custom events are not natively supported, so you have to hijack a random // event. // // Just use jQuery. ================================================ FILE: src/comparisons/events/trigger_custom/ie9.js ================================================ if (window.CustomEvent && typeof window.CustomEvent === 'function') { var event = new CustomEvent('my-event', {detail: {some: 'data'}}); } else { var event = document.createEvent('CustomEvent'); event.initCustomEvent('my-event', true, true, {some: 'data'}); } el.dispatchEvent(event); ================================================ FILE: src/comparisons/events/trigger_custom/jquery.js ================================================ $(el).trigger('my-event', {some: 'data'}); ================================================ FILE: src/comparisons/events/trigger_custom/modern.js ================================================ const event = new CustomEvent('my-event', {detail: {some: 'data'}}); el.dispatchEvent(event); ================================================ FILE: src/comparisons/events/trigger_native/ie8.js ================================================ function trigger(el, eventType) { if (typeof eventType === 'string' && typeof el[eventType] === 'function') { el[eventType](); } else if (eventType === 'string') { if (document.createEvent) { var event = document.createEvent('HTMLEvents'); event.initEvent(eventType, true, false); el.dispatchEvent(event); } else { el.fireEvent('on' + eventType); } } else { el.dispatchEvent(eventType); } } // For a full list of event types: https://developer.mozilla.org/en-US/docs/Web/API/document.createEvent trigger(el, 'focus'); ================================================ FILE: src/comparisons/events/trigger_native/ie9.js ================================================ function trigger(el, eventType) { if (typeof eventType === 'string' && typeof el[eventType] === 'function') { el[eventType](); } else { var event; if (eventType === 'string') { event = document.createEvent('HTMLEvents'); event.initEvent(eventType, true, false); } else { event = eventType; } el.dispatchEvent(event); } } // For a full list of event types: https://developer.mozilla.org/en-US/docs/Web/API/document.createEvent trigger(el, 'focus'); ================================================ FILE: src/comparisons/events/trigger_native/jquery.js ================================================ $(el).trigger('focus'); ================================================ FILE: src/comparisons/events/trigger_native/modern.js ================================================ function trigger(el, eventType) { if (typeof eventType === 'string' && typeof el[eventType] === 'function') { el[eventType](); } else { const event = typeof eventType === 'string' ? new Event(eventType, {bubbles: true}) : eventType; el.dispatchEvent(event); } } trigger(el, 'focus'); // For a full list of event types: https://developer.mozilla.org/en-US/docs/Web/API/Event trigger(el, new PointerEvent('pointerover')); ================================================ FILE: src/comparisons/utils/array_each/ie8.js ================================================ function forEach(array, fn) { for (var i = 0; i < array.length; i++) fn(array[i], i); } forEach(array, function (item, i) {}); ================================================ FILE: src/comparisons/utils/array_each/ie9.js ================================================ array.forEach(function (item, i) {}); ================================================ FILE: src/comparisons/utils/array_each/jquery.js ================================================ $.each(array, function (i, item) {}); ================================================ FILE: src/comparisons/utils/array_each/modern.js ================================================ array.forEach((item, i) => {}); ================================================ FILE: src/comparisons/utils/bind/ie8.js ================================================ fn.apply(context, arguments); ================================================ FILE: src/comparisons/utils/bind/ie9.js ================================================ fn.bind(context); ================================================ FILE: src/comparisons/utils/bind/jquery.js ================================================ $.proxy(fn, context); ================================================ FILE: src/comparisons/utils/deep_extend/ie8.js ================================================ function deepExtend(out) { out = out || {}; for (var i = 1; i < arguments.length; i++) { var obj = arguments[i]; if (!obj) continue; for (var key in obj) { if (obj.hasOwnProperty(key)) { var rawType = Object.prototype.toString.call(obj[key]); if (rawType === '[object Object]') { out[key] = deepExtend(out[key], obj[key]); } else if (rawType === '[object Array]') { out[key] = deepExtend(new Array(obj[key].length), obj[key]); } else { out[key] = obj[key]; } } } } return out; } deepExtend({}, objA, objB); ================================================ FILE: src/comparisons/utils/deep_extend/jquery.js ================================================ $.extend(true, {}, objA, objB); ================================================ FILE: src/comparisons/utils/deep_extend/modern.js ================================================ function deepExtend(out, ...arguments_) { if (!out) { return {}; } for (const obj of arguments_) { if (!obj) { continue; } for (const [key, value] of Object.entries(obj)) { switch (Object.prototype.toString.call(value)) { case '[object Object]': out[key] = out[key] || {}; out[key] = deepExtend(out[key], value); break; case '[object Array]': out[key] = deepExtend(new Array(value.length), value); break; default: out[key] = value; } } } return out; } deepExtend({}, objA, objB); ================================================ FILE: src/comparisons/utils/extend/alternatives.json ================================================ { "Lodash": "https://lodash.com/docs#assign", "Underscore": "https://underscorejs.org/#extend", "ECMA6": "https://www.2ality.com/2014/01/object-assign.html" } ================================================ FILE: src/comparisons/utils/extend/ie8.js ================================================ var extend = function (out) { out = out || {}; for (var i = 1; i < arguments.length; i++) { if (!arguments[i]) continue; for (var key in arguments[i]) { if (arguments[i].hasOwnProperty(key)) out[key] = arguments[i][key]; } } return out; }; extend({}, objA, objB); ================================================ FILE: src/comparisons/utils/extend/jquery.js ================================================ $.extend({}, objA, objB); ================================================ FILE: src/comparisons/utils/extend/modern.js ================================================ const result = {...objA, ...objB}; ================================================ FILE: src/comparisons/utils/index_of/ie8.js ================================================ function indexOf(array, item) { for (var i = 0; i < array.length; i++) { if (array[i] === item) return i; } return -1; } indexOf(array, item); ================================================ FILE: src/comparisons/utils/index_of/ie9.js ================================================ array.indexOf(item); ================================================ FILE: src/comparisons/utils/index_of/jquery.js ================================================ $.inArray(item, array); ================================================ FILE: src/comparisons/utils/is_array/ie8.js ================================================ isArray = Array.isArray || function (arr) { return Object.prototype.toString.call(arr) == '[object Array]'; }; isArray(arr); ================================================ FILE: src/comparisons/utils/is_array/ie9.js ================================================ Array.isArray(arr); ================================================ FILE: src/comparisons/utils/is_array/jquery.js ================================================ $.isArray(arr); ================================================ FILE: src/comparisons/utils/is_numeric/ie8.js ================================================ function isNumeric(num) { if (typeof num === 'number') return num - num === 0; if (typeof num === 'string' && num.trim() !== '') return Number.isFinite ? Number.isFinite(+num) : isFinite(+num); return false; } isNumeric(val); ================================================ FILE: src/comparisons/utils/is_numeric/jquery.js ================================================ $.isNumeric(val); ================================================ FILE: src/comparisons/utils/is_numeric/modern.js ================================================ function isNumeric(num) { if (typeof num === 'number') return num - num === 0; if (typeof num === 'string' && num.trim() !== '') return Number.isFinite(+num); return false; } isNumeric(val); ================================================ FILE: src/comparisons/utils/map/ie8.js ================================================ function map(arr, fn) { var results = []; for (var i = 0; i < arr.length; i++) results.push(fn(arr[i], i)); return results; } map(array, function (value, index) {}); ================================================ FILE: src/comparisons/utils/map/ie9.js ================================================ array.map(function (value, index) {}); ================================================ FILE: src/comparisons/utils/map/jquery.js ================================================ $.map(array, function (value, index) {}); ================================================ FILE: src/comparisons/utils/map/modern.js ================================================ array.map((value, index) => {}); ================================================ FILE: src/comparisons/utils/now/ie8.js ================================================ new Date().getTime(); ================================================ FILE: src/comparisons/utils/now/ie9.js ================================================ Date.now(); ================================================ FILE: src/comparisons/utils/now/jquery.js ================================================ $.now(); ================================================ FILE: src/comparisons/utils/object_each/ie8.js ================================================ function objectEach(obj, callback) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { callback(key, obj[key]); } } } objectEach(obj, function (key, value) {}); ================================================ FILE: src/comparisons/utils/object_each/jquery.js ================================================ $.each(obj, function (key, value) {}); ================================================ FILE: src/comparisons/utils/object_each/modern.js ================================================ for (const [key, value] of Object.entries(obj)) { } ================================================ FILE: src/comparisons/utils/parse_html/ie8.js ================================================ var parseHTML = function (str) { var el = document.createElement('div'); el.innerHTML = str; return el.childNodes; }; parseHTML(htmlString); ================================================ FILE: src/comparisons/utils/parse_html/ie9.js ================================================ var parseHTML = function (str) { var tmp = document.implementation.createHTMLDocument(''); tmp.body.innerHTML = str; return Array.prototype.slice.call(tmp.body.childNodes); }; parseHTML(htmlString); ================================================ FILE: src/comparisons/utils/parse_html/jquery.js ================================================ $.parseHTML(htmlString); ================================================ FILE: src/comparisons/utils/parse_html/modern.js ================================================ function parseHTML(str) { const tmp = document.implementation.createHTMLDocument(''); tmp.body.innerHTML = str; return [...tmp.body.childNodes]; } parseHTML(htmlString); ================================================ FILE: src/comparisons/utils/parse_json/ie8.js ================================================ JSON.parse(string); ================================================ FILE: src/comparisons/utils/parse_json/jquery.js ================================================ $.parseJSON(string); ================================================ FILE: src/comparisons/utils/slice/ie8.js ================================================ function slice(els, start, end) { var f = Array.prototype.slice; try { f.call(document.documentElement); } catch (h) { Array.prototype.slice = function (g, b) { b = 'undefined' !== typeof b ? b : this.length; if ('[object Array]' === Object.prototype.toString.call(this)) return f.call(this, g, b); var e = []; var a = this.length; var c = g || 0; c = 0 <= c ? c : Math.max(0, a + c); var d = 'number' == typeof b ? Math.min(b, a) : a; 0 > b && (d = a + b); d -= c; if (0 < d) if (((e = Array(d)), this.charAt)) for (a = 0; a < d; a++) e[a] = this.charAt(c + a); else for (a = 0; a < d; a++) e[a] = this[c + a]; return e; }; } return els.slice(start, end); } slice(els, start, end); ================================================ FILE: src/comparisons/utils/slice/ie9.js ================================================ els.slice(begin, end); ================================================ FILE: src/comparisons/utils/slice/jquery.js ================================================ $(els).slice(begin, end); ================================================ FILE: src/comparisons/utils/to_array/ie8.js ================================================ function toArray(selector) { var array = []; var elements = document.querySelectorAll(selector); for (var i = 0; i < elements.length; i++) array.push(elements[i]); return array; } ================================================ FILE: src/comparisons/utils/to_array/jquery.js ================================================ $(selector).toArray(); ================================================ FILE: src/comparisons/utils/to_array/modern.js ================================================ const array = [...document.querySelectorAll(selector)]; ================================================ FILE: src/comparisons/utils/trim/ie8.js ================================================ string.replace(/^\s+|\s+$/g, ''); ================================================ FILE: src/comparisons/utils/trim/ie9.js ================================================ string.trim(); ================================================ FILE: src/comparisons/utils/trim/jquery.js ================================================ $.trim(string); ================================================ FILE: src/comparisons/utils/type/ie8.js ================================================ Object.prototype.toString .call(obj) .replace(/^\[object (.+)\]$/, '$1') .toLowerCase(); ================================================ FILE: src/comparisons/utils/type/jquery.js ================================================ $.type(obj); ================================================ FILE: src/components/CodeBlock.astro ================================================ --- import {Prism} from '@astrojs/prism'; export interface Props { lang?: string; code?: string; } const {lang, code} = Astro.props as Props; ---
{code && }
================================================ FILE: src/env.d.ts ================================================ /// ================================================ FILE: src/lib/comparisons.ts ================================================ import path from 'node:path'; import process from 'node:process'; // Astro must be run while the current working directory is the repository root so that the comparison files can be detected. import readFileTree from 'readfiletree'; import sortKeys from 'sort-keys'; import {engineOrder} from './newest-engine'; type FileTree = {[fileName: string]: string | FileTree}; type Engine = Array<{ language: string; code: string; }>; interface Comparison { engines: { ie8?: Engine; ie9?: Engine; ie10?: Engine; ie11?: Engine; jquery: Engine; modern?: Engine; }; alternatives?: Record; } interface Category { comparisons: Record; alternatives?: Record; } type Comparisons = Record; export default async function getComparisons(): Promise { const fileTree: FileTree = await readFileTree( path.join(process.cwd(), 'src', 'comparisons') ); const categories = {}; for (const [categoryName, comparisons] of Object.entries(fileTree)) { const category: Category = { comparisons: {} }; if (comparisons['alternatives.json']) { category.alternatives = JSON.parse(comparisons['alternatives.json']); delete comparisons['alternatives.json']; } for (const [comparisonName, engines] of Object.entries(comparisons)) { const comparison: Comparison = { engines: { jquery: [ { language: 'js', code: engines['jquery.js'] } ] } }; delete engines['jquery.js']; if (engines['alternatives.json']) { comparison.alternatives = JSON.parse(engines['alternatives.json']); delete engines['alternatives.json']; } for (const [engineFile, code] of Object.entries(engines)) { const [engineName, extension] = engineFile.split('.'); if (!comparison.engines[engineName]) { comparison.engines[engineName] = []; } comparison.engines[engineName].push({ language: extension, code }); } for (const engines of Object.values(comparison.engines)) { // Sorted in-place engines.sort((a, b) => { if (a.language === 'js') { return -1; } if (b.language === 'js') { return 1; } return a.language.localeCompare(b.language); }); } comparison.engines = sortKeys(comparison.engines, { compare: (a, b) => engineOrder.indexOf(a) - engineOrder.indexOf(b) }); category.comparisons[comparisonName] = comparison; } category.comparisons = sortKeys(category.comparisons); categories[categoryName] = category; } return sortKeys(categories); } ================================================ FILE: src/lib/newest-engine.ts ================================================ export const engineOrder = ['jquery', 'ie8', 'ie9', 'ie10', 'ie11', 'modern']; export default function getNewestEngine( engines: string[], targetEngine?: string ): string { engines = [...engines]; engines.sort((a, b) => engineOrder.indexOf(b) - engineOrder.indexOf(a)); engines = engines.filter((engine) => engine !== 'jquery'); if (!targetEngine) { return engines[0]; } return ( engines.find( (engine) => engineOrder.indexOf(engine) <= engineOrder.indexOf(targetEngine) ) || engines[0] ); } ================================================ FILE: src/pages/index.astro ================================================ --- import classNames from '@sindresorhus/class-names'; import CodeBlock from '../components/CodeBlock.astro'; import getNewestEngine from '../lib/newest-engine'; import getComparisons from '../lib/comparisons'; import isEven from '../utils/is-even'; import titleCase from '../utils/title-case'; const comparisons = await getComparisons(); --- You Might Not Need jQuery

You might not need jQuery

jQuery and its cousins are great, and by all means use them if it makes it easier to develop your application.

If you're developing a library on the other hand, please take a moment to consider if you actually need jQuery as a dependency. Maybe you can include a few lines of utility code, and forgo the requirement. If you're only targeting more modern browsers, you might not need anything more than what the browser ships with.

At the very least, make sure you know what jQuery is doing for you, and what it's not. Some developers believe that jQuery is protecting us from a great demon of browser incompatibility when, in truth, post-IE8, browsers are pretty easy to deal with on their own; and after the Internet Explorer era, the browsers do even more.

Your search didn't match any comparisons.
{ Object.entries(comparisons).map( ([categoryName, category], index) => (

{titleCase(categoryName)}

{category.alternatives && (

Alternatives:

    {Object.entries(category.alternatives).map( ([alternativeName, alternativeUrl]) => (
  • {alternativeName}
  • ) )}
)}
{Object.entries(category.comparisons).map( ([comparisonName, comparison]) => { const newestEngine = getNewestEngine( Object.keys(comparison.engines) ); return (

{titleCase( comparisonName.replaceAll('_', ' ') )}

{comparison.alternatives && (

Alternatives:

    {Object.entries( comparison.alternatives ).map( ([alternativeName, alternativeUrl]) => (
  • {alternativeName}
  • ) )}
)}
{Object.entries(comparison.engines).map( ([engineName, allCode]) => (

{`${engineName}${ engineName.startsWith('ie') ? '+' : '' }`}

{allCode.map(({language, code}) => ( ))}
) )}
); } )}
) ) }

Made by , and some engineer gamers at HubSpot.

================================================ FILE: src/utils/is-even.ts ================================================ export default function isEven(value: number) { // This is a certified hood classic return value % 2 === 0; } ================================================ FILE: src/utils/throttle.ts ================================================ /** * Throttle function with a trailing edge. * * @param func function to execute * @param wait time in milliseconds to wait before calling again * @returns */ export default function throttle(func: () => void, wait: number = 100) { let context: any, args: any; let waiting = false; let doTrailing = false; return function () { context = this; args = arguments; if (!waiting) { func.apply(context, args); waiting = true; window.setTimeout(function () { if (doTrailing) { func.apply(context, args); } waiting = false; doTrailing = false; context = args = null; }, wait); } else { doTrailing = true; } }; } ================================================ FILE: src/utils/title-case.ts ================================================ const capsWords = ['JSON', 'HTML', 'AJAX']; export default function titleCase(str: string) { return str .replace( /(^|\b)([a-z])([a-z]+)/g, (_match, space, first, rest) => `${space}${first.toUpperCase()}${rest}` ) .replace(new RegExp(`(${capsWords.join('|')})`, 'ig'), (_match, word) => word.toUpperCase() ); }