Resolving SurfaceView Flash Black Issues in Taobao Shopping Cart with Hybrid Architecture

This article analyzes the black‑flash problem of SurfaceView that occurs when the shopping‑cart tab is switched to another tab (e.g., Home) and back in the Taobao app. The issue originates from the fact that SurfaceView creates an independent surface; when its visibility changes (removeView, activity background/foreground switch, or activity destruction), the surface is destroyed and a black frame is shown until new content is rendered.

In contrast, the native DX implementation does not flash because fragment transitions are synchronized with VSync and the view hierarchy remains intact, preventing surface recreation.

Four practical solutions are presented:

Keep the fragment alive by using show/hide instead of attach/detach , so the SurfaceView never leaves the view tree.

Capture a screenshot before leaving the cart and display it during the transition. Example code: private val mTabOtherCallback: () -> Unit = { screenShot() } override fun onBackPress(): Boolean { screenShot(); return false } private fun screenShot() { val bitmap = requestBitmap(); mScreenImageView?.setImageBitmap(bitmap); mScreenImageView?.visibility = View.VISIBLE }

Switch between ImageView and SurfaceView using Weex render‑mode APIs. Example code: weex.promoteRenderSurface(); // image → surface weex.fallbackRenderSurface(); // surface → image

Convert SurfaceView to TextureView (and back) when leaving/entering the cart. Weex provides weex.convertToSurfaceView and weex.convertToTextureView for this purpose.

Each solution has trade‑offs: keeping the fragment alive offers the best performance but increases memory usage; screenshoting is simple but adds latency and may block the UI thread; image‑surface conversion eliminates white frames but requires careful timing and API level checks (PixelCopy works only on Android 8.0+). The article concludes that the most balanced approaches are “Fragment not destroyed” and “ImageView↔SurfaceView conversion with delayed fragment destruction.”