From 9bd3d6fd7c3ef89f5f7ee720673e1db58f4f0b21 Mon Sep 17 00:00:00 2001 From: Michel Weststrate Date: Mon, 1 Feb 2021 11:40:20 -0800 Subject: [PATCH] Fix serialization performance Summary: Using our serialization utilities in the previous diff absolute destroyed the performance of serializing the device logs. Investigated a bit, and the root cause is that *every* object serialization would notify the UI. This is not only pointless, since the UI won't be updated until the next tick anyway, it also is terribly expensive since React has to process and queue all these updates. Exporting the device logs went down from **2 minutes to a few seconds** with this change. (Still a lot slower than JSON.stringify, but I think the flexibility for plugin devs is worth it). This change does not only benefit devicelogs plugin, but all existing plugins as well, plugins like GraphQL should now export their data much quicker. Before (practically all time of serialization is spend in React's setState): {F366147730} After (only a spike at the end of the idler tick): {F366147779} Reviewed By: priteshrnandgaonkar Differential Revision: D26146420 fbshipit-source-id: 9bbeccf04701fd044e041956b7bb00f1e0622b63 --- desktop/app/src/utils/serialization.tsx | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/desktop/app/src/utils/serialization.tsx b/desktop/app/src/utils/serialization.tsx index 11c3eda6e..d646389c6 100644 --- a/desktop/app/src/utils/serialization.tsx +++ b/desktop/app/src/utils/serialization.tsx @@ -140,9 +140,6 @@ export async function makeObjectSerializable( let prevStackLength = stack.length; let accumulator = prevStackLength; while (stack.length > 0) { - if (idler && idler.shouldIdle()) { - await idler.idle(); - } const element = stack[stack.length - 1]; if (element instanceof Map) { const {childNeedsIteration, outputArray} = processMapElement( @@ -202,13 +199,16 @@ export async function makeObjectSerializable( ++numIterations; accumulator += stack.length >= prevStackLength ? stack.length - prevStackLength + 1 : 0; - const percentage = (numIterations / accumulator) * 100; - statusUpdate && - statusUpdate( - `${ - statusMsg || 'Serializing Flipper ' - }: ${numIterations} / ${accumulator} (${percentage.toFixed(2)}%) `, - ); + if (idler && idler.shouldIdle()) { + const percentage = (numIterations / accumulator) * 100; + statusUpdate && + statusUpdate( + `${ + statusMsg || 'Serializing Flipper ' + }: ${numIterations} / ${accumulator} (${percentage.toFixed(2)}%) `, + ); + await idler.idle(); + } prevStackLength = stack.length; } return dict.get(obj);