preload-json

Load data quickly with JSONP

1.0.0
latest
Source
npm

Version published: 9 years ago

Weekly downloads: 2; increased by100%

Maintainers: 1

Weekly downloads

Created: 9 years ago

Source

Preload JSON

preload-json.js allows you to prefetch JSON before it's needed. This lib exists until link[rel=prefetch] or link[rel=preload] are widely adopted.

Scenarios

There are times when this is useful:

Page is heavily cached and you need to load dynamic content (e.g. user data)
Preload data for content below the fold or behind an interaction.

For more rationale, read about Prefetching, preloading, and prebrowsing

Installation

$ npm i --save preload-json

Usage

First, determine a name for the data set. This will be used when requesting and receiving it.

In <head>

<script type="text/javascript">
  // Automatically setup JSONP receivers and interface with `preload-json.js`
  !function(n,e,i){function o(e){n["pjReceive_"+e]=function(o){n[i].push(["notify",e,o])}}n[i]=n[i]||[],n[e]={register:function(){for(var n=0,e=arguments.length;e>n;n++)o(arguments[n])}}}(window,"pj","pjQueue");

  // Register JSONP handlers
  pj.register('dataSetName')
</script>

Before the closing </body>

<script src="http://example.com/data.json?callback=pjReceive_dataSetName" async defer></script>

NOTE: The JSONP callback must be prefixed with pjReceive_

In the app consuming the data

import { subscribe } from 'preload-json'

subscribe('dataSetName', data => {
  console.log('my lib has the data!', data)
})

Demo

npm run demo
open http://localhost:3000/
Now open your console

Scripts

npm run compile - Compiles the module to disk (~/lib).
npm run compile:watch - Same as npm run compile but watches files for changes.
npm run lint - Lints all files.
npm run lint:fix - Lints all files and attempts to fix any issues.
npm run test - Runs unit tests.
npm run test:watch - Same as npm test but watches files for changes.
npm run test:cov - Generates a test coverage report.

Semantic Release

Distribution

Execute one of the following commands

npm version patch -m "Bumped to %s"
npm version minor -m "Bumped to %s"
npm version major -m "Bumped to %s"

FAQs

What is preload-json?

Is preload-json popular?

Is preload-json well maintained?

Package last updated on 24 Feb 2016

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install