coolaj86 / ajquery.js

The fastest, most lightweight, least dependency jQuery alternative.
https://twitter.com/coolaj86/status/1303386788119998464
Mozilla Public License 2.0
80 stars 8 forks source link

ajquery.js

The fastest, most lightweight, fewest dependency jQuery alternative. \ New: Now typed, Ai-enhanced, and better than ever!

Development Build: 721B (types + comments) \ Production Build: 117B (min + gz)

Example Usage

Provides modern, advanced CSS4-compatible query selection:

console.log("innerText:", $("p:nth-child(2").innerText);

Install

via GitHub

my_ver="v3.0.3"

mkdir ./vendor/

curl -fsSL "https://raw.githubusercontent.com/coolaj86/ajquery.js/${my_ver}/ajquery.js" \
    -o ./vendor/ajquery.js

# Lighthouse-optimized
npx -p uglify-js@3 uglifyjs ./vendor/ajquery.js -o ./vendor/ajquery.min.js
<script src="https://github.com/coolaj86/ajquery.js/raw/main/vendor/ajquery.js"></script>

via CDN

<script src="https://unpkg.com/ajquery@3.0.3/ajquery.min.js"></script>

Bundler-optimized:

<script src="https://unpkg.com/ajquery@3.0.3/ajquery.min.cjs"></script>

Tree-shaking-optimized:

<script src="https://unpkg.com/ajquery@3.0.3/ajquery.min.mjs"></script>

via NPM

npm install --save ajquery@3

CommonJS

let AJQuery = require("ajquery");
let $ = AJQuery.$;
let $$ = AJQuery.$$;

ESM

import AJQuery from "ajquery";
let $ = AJQuery.$;
let $$ = AJQuery.$$;

API

$(selector, [rootElement])

Selects the first matching HTML element only (or null):

const body = $("body");
const div1 = $("div", body);

$$(selector, [rootElement])

Selects all matching elements (or an empty NodeList):

const head = $("head");
const stylesheets = $$('link[rel="stylesheet"]', head).map(console.log);

Benchmarks

ajquery-benchmarks

Compatibility

Written entirely in modern ECMAScript 3, and directly transpilable into ES5, ES6 and beyond (up to ES11) via Webpack, Babel, Rollup, React Native, and AWS InfiniDash.

Works in all browsers in living memory.

See the full Browser Compatibility Matrix on MDN.