pixi.js
    Preparing search index...

    Interface SharedRendererOptionsAdvanced

    Options for the shared systems of a renderer.

    interface SharedRendererOptions {
        antialias?: boolean;
        autoDensity?: boolean;
        background?: ColorSource;
        backgroundAlpha?: number;
        backgroundColor: ColorSource;
        bezierSmoothness: number;
        canvas?: ICanvas;
        clearBeforeRender?: boolean;
        depth?: boolean;
        eventFeatures?: Partial<EventSystemFeatures>;
        eventMode?: EventMode;
        failIfMajorPerformanceCaveat?: boolean;
        height?: number;
        hello: boolean;
        manageImports?: boolean;
        renderableGCActive: boolean;
        renderableGCFrequency: number;
        renderableGCMaxUnusedTime: number;
        resolution?: number;
        roundPixels?: boolean;
        skipExtensionImports?: boolean;
        textureGCActive: boolean;
        textureGCAMaxIdle: number;
        textureGCCheckCountMax: number;
        textureGCMaxIdle: number;
        view?: ICanvas;
        width?: number;
    }

    Hierarchy (View Summary)

    Index

    Properties

    antialias?: boolean

    Whether to enable anti-aliasing. This may affect performance.

    autoDensity?: boolean

    Resizes renderer view in CSS pixels to allow for resolutions other than 1.

    This is only supported for HTMLCanvasElement and will be ignored if the canvas is an OffscreenCanvas.

    background?: ColorSource

    Alias for backgroundColor

    backgroundAlpha?: number

    Transparency of the background color, value from 0 (fully transparent) to 1 (fully opaque). This value determines whether the canvas is initialized with alpha transparency support. Note: This cannot be changed after initialization. If set to 1, the canvas will remain opaque, even if a transparent background color is set later.

    1
    
    backgroundColor: ColorSource

    The background color used to clear the canvas. See ColorSource for accepted color values.

    'black'
    
    bezierSmoothness: number

    A value from 0 to 1 that controls the smoothness of bezier curves (the higher the smoother)

    0.5
    
    canvas?: ICanvas

    The canvas to use as a view, optional.

    clearBeforeRender?: boolean

    Whether to clear the canvas before new render passes.

    true
    
    depth?: boolean

    Whether to ensure the main view has can make use of the depth buffer. Always true for WebGL renderer.

    eventFeatures?: Partial<EventSystemFeatures>

    Configuration for enabling/disabling specific event features. Use this to optimize performance by turning off unused functionality.

    const app = new Application();
    await app.init({
    eventFeatures: {
    // Core interaction events
    move: true, // Pointer/mouse/touch movement
    click: true, // Click/tap events
    wheel: true, // Mouse wheel/scroll events
    // Global tracking
    globalMove: false // Global pointer movement
    }
    });

    7.2.0

    eventMode?: EventMode

    The type of interaction behavior for a Container. This is set via the Container#eventMode property.

    // Basic event mode setup
    const sprite = new Sprite(texture);
    sprite.eventMode = 'static'; // Enable standard interaction
    sprite.on('pointerdown', () => { console.log('clicked!'); });

    // Different event modes
    sprite.eventMode = 'none'; // Disable all interaction
    sprite.eventMode = 'passive'; // Only allow interaction on children
    sprite.eventMode = 'auto'; // Like DOM pointer-events: auto
    sprite.eventMode = 'dynamic'; // For moving/animated objects

    Available modes:

    • 'none': Ignores all interaction events, even on its children
    • 'passive': (default) Does not emit events and ignores hit testing on itself and non-interactive children. Interactive children will still emit events.
    • 'auto': Does not emit events but is hit tested if parent is interactive. Same as interactive = false in v7
    • 'static': Emit events and is hit tested. Same as interactive = true in v7
    • 'dynamic': Emits events and is hit tested but will also receive mock interaction events fired from a ticker to allow for interaction when the mouse isn't moving

    Performance tips:

    • Use 'none' for pure visual elements
    • Use 'passive' for containers with some interactive children
    • Use 'static' for standard buttons/controls
    • Use 'dynamic' only for moving/animated interactive elements

    7.2.0

    failIfMajorPerformanceCaveat?: boolean
    height?: number

    The height of the screen.

    600
    
    hello: boolean

    Whether to log the version and type information of renderer to console.

    false
    
    manageImports?: boolean
    true
    

    since 8.1.6

    skipExtensionImports

    renderableGCActive: boolean

    If set to true, this will enable the garbage collector on the GPU.

    true
    
    renderableGCFrequency: number

    Frames between two garbage collections.

    600
    
    renderableGCMaxUnusedTime: number

    The maximum idle frames before a texture is destroyed by garbage collection.

    60 * 60
    
    resolution?: number

    The resolution / device pixel ratio of the renderer.

    roundPixels?: boolean
    skipExtensionImports?: boolean

    Whether to stop PixiJS from dynamically importing default extensions for the renderer. It is false by default, and means PixiJS will load all the default extensions, based on the environment e.g browser/webworker. If you set this to true, then you will need to manually import the systems and extensions you need.

    e.g.

    import 'accessibility';
    import 'app';
    import 'events';
    import 'spritesheet';
    import 'graphics';
    import 'mesh';
    import 'text';
    import 'text-bitmap';
    import 'text-html';
    import { autoDetectRenderer } from 'pixi.js';

    const renderer = await autoDetectRenderer({
    width: 800,
    height: 600,
    skipExtensionImports: true,
    });
    false
    
    textureGCActive: boolean

    If set to true, this will enable the garbage collector on the GPU.

    true
    
    textureGCAMaxIdle: number

    since 8.3.0

    textureGCCheckCountMax: number

    Frames between two garbage collections.

    600
    
    textureGCMaxIdle: number

    The maximum idle frames before a texture is destroyed by garbage collection.

    60 * 60
    
    view?: ICanvas

    Alias for canvas.

    since 8.0.0

    width?: number

    The width of the screen.

    800