From 2ad9807a41bbb17cd277e457ee9045ce3d644cd1 Mon Sep 17 00:00:00 2001 From: jaywcjlove <398188662@qq.com> Date: Fri, 5 May 2023 09:18:18 +0800 Subject: [PATCH] perf: optimize instance preview. --- src/index.tsx | 9 ++++++--- website/pages/run/index.module.less | 2 +- website/pages/run/index.tsx | 6 +++--- 3 files changed, 10 insertions(+), 7 deletions(-) diff --git a/src/index.tsx b/src/index.tsx index ccfa1d8f..79ba9454 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -16,11 +16,15 @@ export default React.forwardRef((props, ref) => useImperativeHandle(ref, () => frameRef.current as HTMLIFrameElement, [frameRef]); - const srcDoc = useMemo(() => { + useMemo(() => { setIsLoaded(false); const jsString = js ? `` : ''; const cssString = css ? `` : ''; - return `${cssString}${html}${jsString}`; + const result = `${cssString}${html}${jsString}`; + const blob = new Blob([result], { type: 'text/html' }); + if (frameRef.current) { + frameRef.current.src = URL.createObjectURL(blob); + } }, [css, html, js]); function renderFrameContents() { @@ -40,7 +44,6 @@ export default React.forwardRef((props, ref) => onLoad && onLoad(evn); }} ref={frameRef} - srcDoc={srcDoc} > {isLoaded && renderFrameContents()} diff --git a/website/pages/run/index.module.less b/website/pages/run/index.module.less index ca1f7091..75ce3c08 100644 --- a/website/pages/run/index.module.less +++ b/website/pages/run/index.module.less @@ -28,7 +28,7 @@ } .editor { - font-size: 12px; + font-size: 16px; background-color: #fff; position: relative; overflow: hidden; diff --git a/website/pages/run/index.tsx b/website/pages/run/index.tsx index 02dc65ed..136c2ae9 100644 --- a/website/pages/run/index.tsx +++ b/website/pages/run/index.tsx @@ -78,7 +78,7 @@ export default function Run() {
handleChange(evn.target.value, 'html')} language="html" @@ -96,7 +96,7 @@ export default function Run() {
handleChange(evn.target.value, 'js')} language="js" @@ -114,7 +114,7 @@ export default function Run() {
handleChange(evn.target.value, 'css')} language="css"