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

@coherentglobal/data-integration-lib

v1.0.13

Published

- Cross-domain browser storage API and secure bi-directional `postMessage` iFrame communication. - Data object size is limited up to 3MB.

Downloads

3

Readme

Data Integration Library

  • Cross-domain browser storage API and secure bi-directional postMessage iFrame communication.
  • Data object size is limited up to 3MB.

Package

Public (Minified) - https://data-integration-lib.s3.ap-southeast-1.amazonaws.com/index.min.js

Features

Cross-Domain Storage Communication

  • Local Storage support
  • Validates origin of Client to gain access to Host

Iframe Embedded Communication

  • Secure bi-directional Host<->Client communication
  • Client emits event that the Host can listen to and vice versa

Example

Cross-Domain Storage Communication

DEMO

Host: https://data-integration-lib.s3.ap-southeast-1.amazonaws.com/hub.html Client1: https://data-integration-lib.s3.ap-southeast-1.amazonaws.com/client1.html Client2: https://data-integration-lib.s3.ap-southeast-1.amazonaws.com/client2.html Client3: https://data-integration-lib.s3.ap-southeast-1.amazonaws.com/client3.html

Limitations on Safari 7+ (OSX, iOS)

All cross-domain local storage access is disabled by default with Safari 7+. This is a result of the "Block cookies and other website data" privacy setting being set to "From third parties and advertisers". Any cross-storage client code will not crash, however, it will only have access to a sandboxed, isolated local storage instance. As such, none of the data previously set by other origins will be accessible. If an option, one could fall back to using root cookies for those user agents, or requesting the data from a server-side store.

Host

The Host will determine the whitelisted domains that can access the Host

new CoherentDataIntegration.Host([
  {
    origin: /\.host.com$/,
    allow: ["get", "set"],
  {
    origin: /\.client.com$/,
    allow: ["get"],
  },
]);

Client

The Client will determine the Host domain and the mode that it will be used is handover

 const client = new CoherentDataIntegration.Client('handover', 'http://www.host.com');

  // Client triggers sending the payload to Host
  client.send({
    name: 'John Doe',
    age: '35',
    gender: 'Male',
  })

  // Client listens to received payload and automatically deletes the storage
  client.receive()
    .then((result) => {
      return result; // Result: { name: 'John Doe', age: '35', gender: 'Male' }
    })
  });

Iframe Embedded Communication

DEMO

Parent: https://data-integration-lib.s3.ap-southeast-1.amazonaws.com/host.html Client: https://data-integration-lib.s3.ap-southeast-1.amazonaws.com/client.html

Parent

The Parent can send and receive data to Child.

<!-- host.html -->
<iframe src="https://www.client.com" id="coherent-frame"></iframe>
// @param
// mode: embedded | handover
// iFrameID: string
const client = new CoherentDataIntegration.Client('embedded', 'coherent-frame');

client.onReceive(data => console.log(data)); // Result: {name: 'Jane', age: 34}
client.send({ name: 'John', age: 28 });

Client

The Client can send and receive data to the Parent

// @param
// mode: embedded | handover
const client = new CoherentDataIntegration.Client('embedded');

client.send({ name: 'Jane', age: 34 });
client.onReceive(data => console.log(data)); // Result: {name: 'John', age: 28}

Benchmarks

Results are using Node v16.11.1 on Macbook Pro M1 8GB Ram

| Object Size | encode | decode | | ----------- | ---------------------------------------------- | --------------------------------------------- | | 1MB | JSON x 436 ops/sec ±1.69% (94 runs sampled) | JSON x 390 ops/sec ±0.47% (92 runs sampled) | | 2MB | JSON x 205 ops/sec ±2.25% (82 runs sampled) | JSON x 172 ops/sec ±2.66% (81 runs sampled) | | 3MB | JSON x 144 ops/sec ±1.27% (83 runs sampled) | JSON x 126 ops/sec ±0.62% (82 runs sampled) | | 1000 keys | JSON x 13,722 ops/sec ±3.74% (86 runs sampled) | JSON x 7,077 ops/sec ±4.22% (87 runs sampled) | | 10000 keys | JSON x 819 ops/sec ±0.85% (94 runs sampled) | JSON x 556 ops/sec ±4.54% (87 runs sampled) |


Diagram

Cross-Domain Storage

API-Scenario

iFrame Embedded Communication

API-Scenario