---
slug: thoughts-on-jquery
title: "Thoughts on jQuery"
date: "2022-09-11T07:23:10-04:00"
draft: true
tables:
  sizes:
    # table columns (required)
    cols:
      - id: "build"
        name: "Build"
        tip: "jQuery build."
      - id: "minified_size"
        name: "Minified"
        tip: "Build size, minified, in kilobytes."
        align: "right"
      - id: "compressed_size"
        name: "Compressed"
        tip: "Build size, minified and compressed, in kilobytes."
        align: "right"

    # table rows (required)
    rows:
      - build: "jQuery 3.6.1 Full"
        minified_size: "90 kB"
        compressed_size: "30 kB"
      - build: "jQuery 3.6.1 Slim"
        minified_size: "73 kB"
        compressed_size: "25 kB"
---
Several of my coworkers do not like [jQuery][].  Some common arguments
against it are:

1. Modern [DOM][] APIs and cross-browser compatibility are now good
   enough that [you don't need jQuery][not needed].
2. [jQuery][] is bloated.
3. [jQuery][] is the source of security problems.

My personal opinion is a bit more nuanced.  I agree that [jQuery][]
isn't *strictly necessary* for new web applications and that the modern
[DOM][] API is usually sufficient.

[If it ain't broke, don't fix it][fix].  It's often easier to maintain
[jQuery][] in an existing web application than to remove or replace it.

Consistency is important for a team of developers working on multiple
web applications.  Relying on consistent dependencies, idioms, and
formatting between disparate web applications is often more important
than using the latest technique or technology, because consistency
reduces the [cognitive load][] for the entire team.

Even as someone who [cares about page size][shrinkage] and [literally
measures JavaScript size by byte][js-byte-size], I don't find the
argument that [jQuery][] is bloated particularly compelling.  The sizes
of [jQuery 3.6.1][] are as follows:

{{< table "sizes" >}}

At these sizes jQuery is relatively small compared to a single bitmap
image

[jquery]: https://jquery.com/
  "jQuery"
[not needed]: https://youmightnotneedjquery.com/
  "You might not need jQuery."
[dom]: https://en.wikipedia.org/wiki/Document_Object_Model
  "Document Object Model"
[fix]: https://idioms.thefreedictionary.com/if+it+ain%27t+broke%2c+don%27t+fix+it
  "If something is performing or functioning well enough, there's no need to change or interfere with it as you may introduce new problems as a result."
[cognitive load]: https://en.wikipedia.org/wiki/Cognitive_load
  "Measure of perceived mental effort."
[jquery 3.6.1]: https://blog.jquery.com/2022/08/26/jquery-3-6-1-maintenance-release/
  "jQuery 3.6.1, the current version of jQuery as of this writing."
[shrinkage]: {{< relref "posts/2022-01-28-media-shrinkage.md" >}}
  "Post about compressing media assets and enabling compression in Apache."
[js-byte-size]: https://git.pablotron.org/sites/pablotron.org/plain/themes/hugo-pt2021/assets/script.js
  "Comment about byte count from unminified JavaScript for this site."
[javascript]: https://en.wikipedia.org/wiki/JavaScript
  "JavaScript programming language."