New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

@internetarchive/lazy-loader-service

Package Overview
Dependencies
Maintainers
13
Versions
14
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@internetarchive/lazy-loader-service

A small library to lazy load javascript with a Promise

0.2.0
latest
npm
Version published
Weekly downloads
94
118.6%
Maintainers
13
Weekly downloads
 
Created
Source

Build Status codecov

Lazy Loader Service

An ES module to lazy load javascript. Based on the lazy loader from Vaadin Router.

Installation

npm install @internetarchive/lazy-loader-service

Usage

import { LazyLoaderService } from '@internetarchive/lazy-loader-service';

const lazyLoaderService = new LazyLoaderService();

await lazyLoaderService.loadScript({ src: 'https://my-server.com/some-service.js' });

// assuming `some-service.js` creates `window.someService`
const response = window.someService.getResponse('foo');

...

Advanced Usage

Use an alternate script container instead of document.head (the default).

<div id="script-container"></div>
import { LazyLoaderService } from '@internetarchive/lazy-loader-service';

const container = document.querySelector('#script-container');
const lazyLoaderService = new LazyLoaderService(container);

Load a javascript module / nomodule

import { LazyLoaderService } from '@internetarchive/lazy-loader-service';

const lazyLoaderService = new LazyLoaderService();
await lazyLoaderService.loadBundle({
  module: 'https://my-server.com/some-service-module.js',
  nomodule: 'https://my-server.com/some-service-nomodule.js'
});

const response = window.someService.getResponse('foo');
...

Add additional attributes to the script tags

import { LazyLoaderService } from '@internetarchive/lazy-loader-service';

const lazyLoaderService = new LazyLoaderService();
await lazyLoaderService.loadScript({
  src: 'https://my-server.com/some-service.js',
  attributes: [{ key: 'foo', value: 'bar' }]
});

=>

<script src="https://my-server.com/some-service.js" async foo="bar"></script>

Development

Prerequisite

npm install

Start Development Server

npm start

Testing

npm test

Testing via browserstack

npm test:bs

Linting

npm lint

FAQs

Package last updated on 02 Dec 2021

Did you know?

Socket

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

Related posts