KOEN
Read Original
#Mobile

Performance for Everyone

Performance for Everyone
01

Summary

Automating App Performance: From 2 Weeks of Coding to 'Free' Measurement

How Pinterest uses View Tree Traversal to track Visually Complete metrics across 60+ surfaces

While performance is a 'default feature' for mobile apps, measuring it accurately across diverse surfaces is a major engineering challenge. Pinterest solved this by building an all-in-one solution into their base UI classes, allowing developers to get performance metrics 'for free.' This article explores their automated approach to capturing Visually Complete data.

  • 01Standardized 'Visually Complete' definitions across diverse UI surfaces
  • 02Automated rendering status tracking through RootView tree traversal
  • 03Reduced performance metric implementation time from 2 weeks to zero
  • 04Enabled fair performance comparisons across all app features using a unified standard
  • 05Cross-platform expansion of the performance measurement framework to iOS and Web

RECOMMENDATION

Highly recommended for mobile engineering teams seeking consistent performance observability in large-scale apps. It provides a blueprint for senior developers to automate repetitive performance tracking through base class architecture.

The Problem

Measuring user-perceived latency (Visually Complete) required custom logic for each UI surface due to varying rendering definitions, leading to high maintenance costs and a two-week implementation overhead per surface.

The Solution

Pinterest integrated measurement logic into a BaseSurface class that automatically traverses the View Tree to detect the rendering status of standardized media interfaces such as PerfImageView and PerfTextView.

The Result

The system now visualizes latency for over 60 surfaces automatically on Android and has been successfully extended to iOS and Web platforms, enabling immediate performance monitoring for new features without extra engineering effort.

Trade-off

The 'Walk the View Tree' approach might introduce minor runtime overhead depending on layout complexity and requires strict adherence to standardized UI interfaces to ensure measurement accuracy.

03

Key Concepts

Concept · 01

Visually Complete

A performance metric measuring the time from a user action until the content is fully rendered and visible on the screen.

  • Defined differently across surfaces, such as video playback start or text/image rendering completion.
Concept · 02

View Tree Traversal

A technique of visiting every view node starting from the RootView to inspect its current state or properties.

  • Used at the BaseSurface level to iterate through visible views and judge if they have finished drawing.
Concept · 03

Perf View Interfaces

Standardized interfaces for UI components that allow them to report their rendering and loading status in a consistent manner.

  • Includes methods like isDrawn() and isVideoLoadStarted() to facilitate automated latency measurement.