https://github.com/hyperdivision/fast-on-load

Faster and simplified version of on-load without dom diffing support
https://github.com/hyperdivision/fast-on-load

Last synced: 15 days ago
JSON representation

Faster and simplified version of on-load without dom diffing support

• Host: GitHub
• URL: https://github.com/hyperdivision/fast-on-load
• Owner: hyperdivision
• License: mit
• Created: 2019-05-15T12:52:38.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2019-08-30T12:57:51.000Z (about 5 years ago)
• Last Synced: 2024-10-19T14:42:33.101Z (24 days ago)
• Language: JavaScript
• Size: 25.4 KB
• Stars: 36
• Watchers: 6
• Forks: 4
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# `fast-on-load`

[![Build Status](https://travis-ci.org/hyperdivision/fast-on-load.svg?branch=master)](https://travis-ci.org/hyperdivision/fast-on-load)

> Faster and simplified version of [on-load](https://github.com/shama/on-load) without dom diffing support.

## Usage

``` js

const onload = require('fast-on-load')

onload(domElement, function () {

  console.log('element was mounted')

}, function () {

  console.log('element was unmounted')

})

```

Uses a MutationObserver and a generated class together with `getElementsByClassName()` to find DOM nodes that on-load is tracking, which performs

much faster (around 1000x in our machines) on bigger DOM trees that the tree traversal algo `on-load` uses.

## API

`const node = onload(node, [onload], [onunload])`

Watch `node`, optionally passing `onload` and `onunload` handler.

Returns the node itself.

`onload.delete(node, [onload], [onunload])`

Pass in references to the `onload` and `onunload` functions and the node they are attached to to remove them from the function set that get run on load and unload.  Pass `undefined` for `onload` if you only attached and `onunload` function.

`onload = onload.bind(dom.window)`

To run in non-dom context, such as [jsdom](https://ghub.io/jsdom), call `onload` with desired `window` context.

## Install

```sh

npm install fast-on-load

```

## License

MIT