npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

jquery-detached2

v2.1.15-v1

Published

Module for creating multiple jQuery instances, detached from the global namespace (window).

Downloads

3

Readme

NPM module that allows you to get multiple jQuery instances that are "detached" from the global namespace (window) i.e. different versions of jQuery and/or multiple instances of the same version.

Install Package:

npm install --save jquery-detached-<jquery-version>

Of course, the above will depend on whether or not we have published that exact version of jquery. The easiest way to see the versions we have published is to look at the branch names on GutHub

Motivation

Having run into issues using a single shared jQuery instance across multiple libraries/apps running a browser, each requiring different versions of jQuery, or unwittingly polluting the shared jQuery instance with extensions that conflict with each other.

Getting a shared jQuery instance

Creating multiple instances of jQuery should be avoided if possible, but only when that shared instance is not being polluted. When running in an environments where it is known to be safe to use a shared jQuery instance e.g. a closed environment, where everything is controlled (extensions etc), or in an environment where this shared instance is not modified through extension.

var jQuery = require('jquery-detached-<jquery-version>');
var $ = jQuery.getJQuery();

var myDivs = $('.myDivs');

// etc...

Getting a "new" jQuery instance

This is intended for use only with libraries that extend jQuery (e.g. Twitter Bootstrap, jQuery UI), allowing them to get a clean jQuery instance to extend. This should then allow these libraries to work in isolation from each other in environments where multiple libraries and frameworks need to be able to co-exist e.g. in the Jenkins CI ecosystem, where there are 1000+ plugins, any of which may be using a variety of different JavaScript libraries that depend on jQuery (and different versions of jQuery).

var jQuery = require('jquery-detached-<jquery-version>');
var $ = jQuery.newJQuery();

//
// Do something with your jQuery/$ instance. See notes below.
// 

As regards what needs to be done with your $, you probably need to perform a noConflict equivalent operation. Here are some random thoughts:

  • backup the existing jQuery and $ globals, if any (ala noConflict)
  • set your $ on window.$ and window.jQuery
  • "statically" initialise your library, allowing it to glom onto your $ instance
  • save you $ somewhere that you can ref it again easily e.g. some other special/private namespace
  • restore the global namespace to its original state (ala noConflict)