Skip to main content

后台加载器

¥Background Loader

PixiJS 提供了一个后台加载器，允许你在应用运行时在后台加载资源。这对于加载大型资源或多个资源而不阻塞主线程非常有用。这可以帮助提升应用的响应速度，减少初始加载时间，并可能避免向用户显示多个加载屏幕。

¥PixiJS provides a background loader that allows you to load assets in the background while your application is running. This is useful for loading large assets or multiple assets without blocking the main thread. This can help improve the responsiveness of your application, reduce the initial loading time, and potentially void showing multiple loading screens to the user.

加载 Bundle​

¥Loading Bundles

使用后台加载器最有效的方法是加载资源包。打包包是指以某种方式相互关联的资源组，例如游戏中特定屏幕或关卡的所有资源。通过在后台加载资源包，你可以确保在需要时资源可用，而不会阻塞主线程。

¥The most effective way to use the background loader is to load bundles of assets. Bundles are groups of assets that are related to each other in some way, such as all the assets for a specific screen or level in your game. By loading bundles in the background, you can ensure that the assets are available when you need them without blocking the main thread.

    const manifest = {
        bundles: [
            {
                name: 'home-screen',
                assets: [
                    { alias: 'flowerTop', src: 'https://pixi.nodejs.cn/assets/flowerTop.png' },
                ],
            },
            {
                name: 'game-screen',
                assets: [
                    { alias: 'eggHead', src: 'https://pixi.nodejs.cn/assets/eggHead.png' },
                ],
            },
        ],
    };

    // Initialize the asset system with a manifest
    await Assets.init({ manifest });

    // Start loading both bundles in the background
    Assets.backgroundLoadBundle(['game-screen']);

    // Load only the first screen assets immediately
    const resources = await Assets.loadBundle('home-screen');

加载单个资源​

¥Loading Individual Assets

你还可以使用 Assets.backgroundLoad() 方法在后台加载单个资源。这对于加载不属于 bundle 的资源或在初始加载后加载其他资源非常有用。

¥You can also load individual assets in the background using the Assets.backgroundLoad() method. This is useful for loading assets that are not part of a bundle or for loading additional assets after the initial load.

    // Load an individual asset in the background
    Assets.backgroundLoad({ alias: 'flowerTop', src: 'https://pixi.nodejs.cn/assets/flowerTop.png' });

    // Load another asset in the background
    Assets.backgroundLoad({ alias: 'eggHead', src: 'https://pixi.nodejs.cn/assets/eggHead.png' });

API 参考​

¥API Reference