Optimizing Flutter Image and Texture Caching for Memory Efficiency

Background: The Xianyu app uses a custom external texture solution where Android creates a SurfaceTexture, registers it with Flutter via FlutterJNI, and returns a texture ID to the Flutter layer. Image data is written to the SurfaceTexture using OpenGL and transferred to the Flutter side through shared memory for Skia rendering.

Problems: Flutter’s texture data is not cached, causing repeated bitmap‑to‑texture conversions and high memory usage. Native bitmap caching and Flutter’s ImageCache are isolated, leading to duplicated memory consumption, especially for network‑loaded external textures.

Analysis: The ideal solution is a single memory cache that can store both textures and Flutter ImageCache entries, eliminating redundant caches and reducing memory waste.

Solution: Extend the existing ImageCache to also cache texture data. Since ImageCache only exposes putIfAbsent , a custom cache was created by subclassing ImageCache and overriding the binding’s createImageCache method. New methods such as TextureCacheKey and TextureImageStreamCompleter were added to manage texture identifiers, loading, and listener callbacks. Reference counting is used to release texture memory only when no widget holds it.

Effect: Testing on a search results page with many large images showed a significant reduction in physical memory usage after the optimization. The memory curve after optimization is lower and smoother, with fewer GC spikes.

Outlook: While the approach achieves a unified cache and memory savings, it requires invasive changes to ImageCache source code, which may need extra maintenance for future Flutter engine updates. Additional monitoring for oversized images (>2 MB) was also added to detect misuse of image loading APIs.