https://github.com/typicode/pegasus

Load JSON while still loading other scripts
https://github.com/typicode/pegasus

Last synced: 5 days ago
JSON representation

Load JSON while still loading other scripts

• Host: GitHub
• URL: https://github.com/typicode/pegasus
• Owner: typicode
• License: mit
• Created: 2014-06-10T16:34:31.000Z (over 10 years ago)
• Default Branch: master
• Last Pushed: 2017-10-07T15:11:50.000Z (about 7 years ago)
• Last Synced: 2024-05-22T22:33:06.143Z (5 months ago)
• Language: JavaScript
• Homepage: http://typicode.github.io/pegasus/
• Size: 133 KB
• Stars: 702
• Watchers: 32
• Forks: 59
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Pegasus [![](https://badge.fury.io/js/%40typicode%2Fpegasus.svg)](https://www.npmjs.com/package/@typicode/pegasus) ![](https://badge-size.herokuapp.com/typicode/pegasus/master/dist/pegasus.min.js.svg?compression=gzip)

> Pegasus is a tiny lib that lets you load JSON data while loading other scripts.

If you have a static website, using this technique, you can reduce the time to display data. Works with any JS lib (React, Vue, jQuery, ...).

__Before__

[![](http://i.imgur.com/ves4uIf.png)](http://typicode.github.io/pegasus/)

_JSON (yellow bar) is downloaded several milliseconds after the JS library (orange bar)._

__After (with Pegasus)__

[![](http://i.imgur.com/8sVBtnB.png)](http://typicode.github.io/pegasus/)

_JSON (yellow bar) and the JS library (orange bar) are downloaded at the same time._

## Install

### Embedded (recommended)

To save a network call, it's recommended to simply paste the following code [pegasus.min.js](https://github.com/typicode/pegasus/blob/master/dist/pegasus.min.js) in your HTML page before other scripts.

### CDN

https://unpkg.com/@typicode/pegasus/dist/pegasus.min.js

### npm

```bash

$ npm install @typicode/pegasus

```

Please note that pegasus is available on npm under __[@typicode/pegasus](https://www.npmjs.com/package/@typicode/pegasus)__

## Demo

http://typicode.github.io/pegasus

## Benchmark

Average time to display data on the [demo site](http://typicode.github.io/pegasus).

|             | jQuery only  | jQuery + Pegasus  |

|:------------|:-------------|:------------------|

|__EDGE__     | 3000 ms      | 2100 ms           |

|__3G__       | 860 ms       | 640 ms            |

|__DSL__      | 270 ms       | 230 ms            |

__Note__: jQuery is used for illustration only, you can use Pegasus with any other Javascript library.

## Usage example

```html

  var request = pegasus('http://api.example.com');

  request.then(

    // success handler

    function(data, xhr) {

      // do something useful like

      $('#data').text(JSON.stringify(data));

    },

    // error handler (optional)

    function(data, xhr) {

      console.error(data, xhr.status)

    }

  );

```

Optionally, you can set a timeout using `pegasus.timeout = milliseconds`

## Support

All modern browsers and IE9+

## License

MIT - [Typicode](https://github.com/typicode)