@pixi/ticker is a module from the PixiJS library that provides a highly efficient and flexible ticker for managing animation frames and timed updates. It is particularly useful for game development and other real-time applications where precise control over the rendering loop is required.

What are @pixi/ticker's main functionalities?

Basic Ticker Usage

This code demonstrates how to create a basic ticker, add a callback function to it, and start the ticker. The callback function logs the delta time (time elapsed since the last frame) to the console.

const { Ticker } = require('@pixi/ticker');
const ticker = new Ticker();
ticker.add((deltaTime) => {
  console.log(`Delta time: ${deltaTime}`);
});
ticker.start();

Adding Multiple Callbacks

This code shows how to add multiple callback functions to a single ticker. Both callbacks will be executed on each tick, logging their respective messages to the console.

const { Ticker } = require('@pixi/ticker');
const ticker = new Ticker();
const callback1 = (deltaTime) => {
  console.log(`Callback 1 - Delta time: ${deltaTime}`);
};
const callback2 = (deltaTime) => {
  console.log(`Callback 2 - Delta time: ${deltaTime}`);
};
ticker.add(callback1);
ticker.add(callback2);
ticker.start();

Removing Callbacks

This code demonstrates how to remove a callback from the ticker after a certain period of time (5 seconds in this case). The callback will no longer be executed after it is removed.

const { Ticker } = require('@pixi/ticker');
const ticker = new Ticker();
const callback = (deltaTime) => {
  console.log(`Delta time: ${deltaTime}`);
};
ticker.add(callback);
ticker.start();
setTimeout(() => {
  ticker.remove(callback);
  console.log('Callback removed');
}, 5000);

Pausing and Resuming the Ticker

This code shows how to pause and resume the ticker. The ticker is paused after 3 seconds and resumed after 6 seconds, with appropriate messages logged to the console.

const { Ticker } = require('@pixi/ticker');
const ticker = new Ticker();
ticker.add((deltaTime) => {
  console.log(`Delta time: ${deltaTime}`);
});
ticker.start();
setTimeout(() => {
  ticker.stop();
  console.log('Ticker paused');
}, 3000);
setTimeout(() => {
  ticker.start();
  console.log('Ticker resumed');
}, 6000);

Other packages similar to @pixi/ticker

Readme

Source

@pixi/ticker

Installation

npm install @pixi/ticker

Usage

Create a Ticker object directly:

import { Ticker } from '@pixi/ticker';

const ticker = new Ticker();
ticker.start();

Use as an Application plugin:

import { TickerPlugin } from '@pixi/ticker';
import { Application } from '@pixi/app';

Application.registerPlugin(TickerPlugin);

const app = new Application();
app.ticker.start();

FAQs

What is @pixi/ticker?

Is @pixi/ticker popular?

Is @pixi/ticker well maintained?

Last updated on 24 Mar 2021

Did you know?

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