Improve Application Performance and User Engagement with Advanced GraphQL Features

Kewei QuMeta, Senior Staff Software Engineer at Meta

In this talk, I will go through two recent experiments at Meta where we improved Application scroll perf (commonly known as frame drops) and media stalls by developing advanced GraphQL features. 1. Batched @defers. Common UI update cycles with regular defers will introduce increased state updates and may cause unnecessary re-renders. By batching deferred payloads carefully, we can achieved improved latency without introduce frame drops which is commonly associated with decreased engagement. 2. Improved CDN prefetch. Most of the time, the bottleneck to TTI is the media loads, either image load or video load. Commonly, Applications prefetch these media from CDN to improve stalls. We can make the prefetch better by using the visitor pattern which is available in many GraphQL library to enable prefetch during parsing time.