From b3e64dcf714bee2f273dc553facf53633383d594 Mon Sep 17 00:00:00 2001
From: Titus Wormer <tituswormer@gmail.com>
Date: Wed, 20 Oct 2021 09:15:27 +0200
Subject: [PATCH] Add note on performance of `evaluate`

Closes GH-1655.
---
 package-lock.json      |  4 ++--
 packages/mdx/readme.md | 16 ++++++++++++++++
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 8563ab787..0a195ba78 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -29,7 +29,7 @@
         "@codemirror/view": "^0.19.0",
         "@node-loader/babel": "^1.0.0",
         "@node-loader/core": "^1.0.0",
-        "ahooks": "^2.10.11",
+        "ahooks": "^2.0.0",
         "ap-style-title-case": "^1.0.0",
         "autoprefixer": "^10.0.0",
         "babel-loader": "^8.0.0",
@@ -63,7 +63,7 @@
         "puppeteer-core": "^10.0.0",
         "react": "0.0.0-experimental-7ec4c5597",
         "react-dom": "0.0.0-experimental-7ec4c5597",
-        "react-error-boundary": "^3.1.3",
+        "react-error-boundary": "^3.0.0",
         "react-fetch": "0.0.0-experimental-7ec4c5597",
         "react-server-dom-webpack": "0.0.0-experimental-7ec4c5597",
         "react-tabs": "^3.0.0",
diff --git a/packages/mdx/readme.md b/packages/mdx/readme.md
index 240c7f4fe..1a19a796c 100644
--- a/packages/mdx/readme.md
+++ b/packages/mdx/readme.md
@@ -737,6 +737,22 @@ console.log(await evaluate(file, {...runtime}))
 
 </details>
 
+###### Note: Performance
+
+Compiling (and running) MDX takes time.
+If you’re live-rendering a string of MDX that often changes using a virtual DOM
+based framework (such as React), one performance improvement is to call the
+`MDXContent` component yourself.
+The reason is that the `evaluate` creates a new function each time, which cannot
+be diffed:
+
+```diff
+ const {default: MDXContent} = await evaluate('…')
+
+-<MDXContent {...props} />
++MDXContent(props)
+```
+
 ### `evaluateSync(file, options)`
 
 Compile and run MDX.