feat: optimize html render

src/renderer/plugins/build-in-renderers.ts

@@ -1,4 +1,5 @@
 import type { Plugin } from '@fe/context'
+import type { Doc } from '@fe/types'
 
 export default {
   name: 'build-in-renderers',
@@ -29,17 +30,6 @@ export default {
       },
     })
 
-    ctx.renderer.registerRenderer({
-      name: 'html',
-      when (env) {
-        return !!(env.file && !env.safeMode && env.file.path.toLowerCase().endsWith('.html'))
-      },
-      render (src) {
-        const iframeProps = { style: `background: #fff; position: fixed; left: 0; top: 0; height: var(${ctx.args.CSS_VAR_NAME.PREVIEWER_HEIGHT})` }
-        return ctx.lib.vue.h(ctx.embed.IFrame, { html: src, triggerParentKeyBoardEvent: true, iframeProps })
-      },
-    })
-
     ctx.renderer.registerRenderer({
       name: 'plain-text',
       when (env) {
@@ -55,5 +45,35 @@ export default {
         }, src)
       },
     })
+
+    function isHtmlDoc (doc: Doc) {
+      return doc.type === 'file' && doc.path.toLowerCase().endsWith('.html')
+    }
+
+    let renderHtmlTime = 0
+    ctx.renderer.registerRenderer({
+      name: 'html',
+      when (env) {
+        return !!(env.file && !env.safeMode && isHtmlDoc(env.file))
+      },
+      render (src, env) {
+        const iframeProps = { style: `background: #fff; position: fixed; left: 0; top: 0; height: var(${ctx.args.CSS_VAR_NAME.PREVIEWER_HEIGHT})` }
+        const doc = env.file
+        if (doc) {
+          const url = ctx.base.getAttachmentURL(doc) + '?_t=' + renderHtmlTime
+          const html = `<iframe src="${url}" style="${iframeProps.style};width: 100vw; height: 100vh; display: block; border: none;" />`
+          return ctx.lib.vue.h(ctx.embed.IFrame, { html, triggerParentKeyBoardEvent: true, iframeProps })
+        } else {
+          return ctx.lib.vue.h(ctx.embed.IFrame, { html: src, triggerParentKeyBoardEvent: true, iframeProps })
+        }
+      },
+    })
+
+    ctx.registerHook('DOC_SAVED', ({ doc }) => {
+      if (isHtmlDoc(doc)) { // render html doc after saved
+        renderHtmlTime = Date.now()
+        ctx.view.render()
+      }
+    })
   }
 } as Plugin