Batch DOM manipulations in a performant manner
JavaScript HTML
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.

README.md

write

Version Badge Build Status Dependencies License File Size

Batch DOM manipulations in a performant manner

Usage

Schedule a frame to batch DOM mutations for better performance:

write(() => {
    // Add to the DOM
    document.body.appendChild(element);

    // Mutate existing element
    element.classList.add('foo');
});

Throttle frames to a specific frame rate (defaults to 60):

write.fps(60);

write(() => {
    element.innerHTML = '<div></div>';
});

Each invocation returns a function capable of removing the scheduled callback from the queue:

const remove = write(() => {
    element.classList.add('foo');
});

// Cancel the previously scheduled callback
remove();

Remove all callback functions from the queue and cancel the frame:

write(() => {
    element.setAttribute('id', 'bar');
});

write(() => {
    element.style.display = 'block';
});

// Removes the 2 scheduled callbacks
write.clear();

Installation

Write is CommonJS and AMD compatible with no dependencies. You can download the development or minified version, or install it in one of the following ways:

npm install ryanmorr/write

bower install ryanmorr/write

Tests

Open test/runner.html in your browser or test with PhantomJS by issuing the following commands:

npm install
npm install -g gulp
gulp test

License

This project is dedicated to the public domain as described by the Unlicense.