0.2.1 • Published 8 years ago

leopard.js v0.2.1

Weekly downloads
-
License
MIT
Repository
-
Last release
8 years ago

Leopard

60 FPS pages made easy.

Performant, heuristic scheduler for building user interface (Just 4 kb gzipped).

Leopard eliminates jank from websites by scheduling page interactions automatically. For pages with heavy DOM manipulation, Leopard will batch update related manipulation. For pages with heavy JavaScript calculation, Leopard will schedule the calculation for avoiding jank.

Install

npm install leopard.js
<script src="build/leopard.min.js"></script>

Examples

Usage

Schedule user actions with high priority

target.addEventListener('click', function(e) {
  Leopard.put(1, function() {
    // feedback of user actions
  })
})
Leopard.put(10, function() {
  // sync the data, upload analysis data, etc.
})
Leopard.start()

Listen events

Leopard.put(2, function() {
  console.log('priority 2: task')
})
Leopard.put(1, function() {
  console.log('priority 1: first task')
})
Leopard.put(1, function() {
  console.log('priority 1: second task')
})
Leopard.on(1, function () {
  console.log('priority 1: complete')
})
Leopard.start()

Output:

priority 1: first task
priority 1: second task
priority 1: complete
priority 2: task

API

Leopard.put(priority, callback)

priority Integer between 0 to 1000, lower value, higher priority.

Enqueue a task with specific priority to the Scheduler.

Leopard.start([options])

Start Leopard, the options is for optional advanced setting.

Leopard.stop()

Stop Leopard and flush the unfinished tasks in the scheduler queue.

Events

When all tasks in one priority queue finish, Leopard will fire an event. Your can listen to the specific priority queue.

Leopard.on(priority, callback)

Leopard.once(priority, callback)

Options

NameTypeUsageDefault
limitIntegerThe limit of actions can be executed per frame. Leopard will adjust this value based on the browser performance. If each actions in scheduler queue costs many resources, then decrease this option.1000
strategyStringThe batching strategy. For pages with heavy DOM manipulation (a lot of page re-layout, re-paint), you should set the option to batch. Leopard will batch update and avoid too many page re-paint. Otherwise, keep this option as normal, Leopard will schedule those operation for avoiding jank.'normal'
perfFloatTune the performance. Bigger the number, better perfmance , but lower FPS.2.0
autoStopBooleanautomatically stop if there's no tasks in scheduler queue.false

Concept

The algorithm for calculating maximum actions per frames is inspired by TCP congestion control

The scheduler for scheduling the prioritised actions is based on Fixed priority none-preemptive scheduling. You specify the priority of tasks by yourself. Be careful about number of tasks you assign to the scheduler. Too many tasks in a scheduler queue will cause Starvation.

Browser Support

ChromeFirefoxIESafari
latestlatest9+latest

License

MIT

0.2.1

8 years ago

0.2.0

8 years ago

0.1.1

8 years ago

0.1.0

8 years ago

0.0.1

8 years ago