Platform Capabilities
Technical Features
Libpag's core code is written in C++, and it utilizes WebAssembly technology to compile the C++ code into a libpag.wasm file, which can be executed on the Web platform.You do not require extensive knowledge of WebAssembly to use libpag. However, if you are interested, you can refer to the WebAssembly documentation and emscripten documentationfor more information.
Rendering uses the WebGL environment and does not support Canvas2D.
Memory Reclaim
Due to the utilization of WebAssembly, most of the objects created using libpag have C++ pointers and remain unaffected by the browser's GC. Therefore, if you do not need to use the object, it is recommended to call the destroy method of the object.
Compatibility
 Chrome |  Safari | Chrome for Android | Safari on iOS |
|---|---|---|---|
| Chrome >= 69 | Safari >= 11.3 | Android >= 7.0 | iOS >= 11.3 |
The libpag website is built using WebAssembly + WebGL, allowing it to fully utilize the capabilities of libpag through the Web platform. The compatibility table above solely indicates the supported environments.
The rendering performance of libpag is affected by the following conditions:
- Complexity of PAG animation files
- How to call libpag
- Web browser environment This article focuses on the performance of the libpag website across different browsers and also discusses compatible backup solutions.
Registering the software decoder ffavc needs to load one more wasm file, which will increase memory and CPU usage.
Desktop SDK
Chrome (Win/Mac)
Good performance
Safari (Mac)
Good performance
Firefox (Win/Mac)
Performance is good except for PAG animation files with BMP sequence frames.
Because Firefox's Video tag cannot parse videos converted from BMP sequence frames in PAG animation files, it is necessary to register a software decoder ffavc. Example Demo
Mobile SDK
Safari (iOS)
Performance is good except for PAG animation files with BMP sequence frames.
Libpag parses the PAG animation file with BMP sequence frames and calls the blobURL attribute of the video tag to decode the video. However, when the blobURL is a video of src on the iOS Safari browser, there will be bugs such as "dropping frames at the end of the video" and "The currentTime attribute does not change after modification, but the video image is successfully rendered" .
Moreover, when the iOS device is in power-saving mode or in the WeChat browser, there is a rule restriction that "the user can only use the video tag to play video after interacting with the page". As a result, any scenario that involves playing animations will need to wait for user interaction before starting.
To prevent any issues caused by the compatibility of the two environments mentioned above, it is recommended to use the registered software decoder ffavc for parsing the video. This is currently the best solution available. Example Demo
Chrome (Android)
Performance is good except for PAG animation files with BMP sequence frames.
Some Android devices and WeChat browsers have a rule restriction that "the user can only use the video tag to play video after interacting with the page". As a result, any scenario that involves playing animations will need to wait for user interaction before starting.
To avoid issues, we utilize the registered decoder ffavc to parse videos. However, ffavc software decoding performance on Android devices is subpar, making it an unsuitable solution. We are working on finding a better solution to address this situation in the future. In the meantime, it is important for the access side to instruct users to interact with each other in the business scenario to avoid the rule restriction that "the user can only use the video tag to play video after interacting with the page".
Android Native Browser
Due to the diverse range of manufacturers and their respective browsers, compatibility is affected not only by variations in browser implementation but also by differences in GPU chips. As a result, we currently do not have plans to support these machines and will instead prioritize compatibility with mainstream browsers.