Add logic to prevent re-renders (flicker)

pnp · Jan 20, 2023 · 7d033e5 · 7d033e5
1 parent b35f5b6
commit 7d033e5
Showing 1 changed file with 5 additions and 3 deletions.
diff --git a/src/controls/adaptiveCardHost/AdaptiveCardHost.tsx b/src/controls/adaptiveCardHost/AdaptiveCardHost.tsx
@@ -153,9 +153,11 @@ export const AdaptiveCardHost = (props: IAdaptiveCardHostProps): JSX.Element =>
       currentAdaptiveCard.parse(cardPayload, serializationContextInstanceRef.current);
 
       const renderedElement = currentAdaptiveCard.render();
-      currentRenderElement.innerHTML = "";
-      currentRenderElement.appendChild(renderedElement);
-
+      // If this isn't acceptable, we should compare the old template with the new template
+      if (renderedElement.outerHTML !== currentRenderElement.innerHTML) {
+        currentRenderElement.innerHTML = "";
+        currentRenderElement.appendChild(renderedElement);
+      }
     } catch (cardRenderError) {
       if (props.onError) {
         props.onError(cardRenderError);