Merge pull request #39 from Himenon/perf-remove-full-render-js

Himenon · web-flow · commit c90bdc241319 · 2020-02-07T17:27:48.000+09:00
perf(static-page): not access full.render.js
diff --git a/packages/cli/src/exporter/index.ts b/packages/cli/src/exporter/index.ts
@@ -22,7 +22,7 @@ export const create = (service: Service.Type, config: Config.Type, isDryRun: boo
       service.renderer.renderToString,
       config.filePathList,
       assets,
-      config.rendererType,
+      "server",
     );
     return "<!DOCTYPE html>" + ReactDOM.renderToStaticMarkup(view);
   };
diff --git a/packages/cli/src/exporter/view/template.tsx b/packages/cli/src/exporter/view/template.tsx
@@ -33,7 +33,7 @@ export const create = ({ assets, context, url, ...props }: Props, csrProps: Clie
         <meta httpEquiv="X-UA-Compatible" content="ie=edge" />
         <script src={assets.scripts.react} />
         <script src={assets.scripts["react-dom"]} />
-        <script src={assets.scripts["full.render.js"]}></script>
+        {props.ssr.rendererType === "client" && <script src={assets.scripts["full.render.js"]} />}
         <link href={assets.stylesheets.styles} rel="stylesheet" />
         <script
           dangerouslySetInnerHTML={{
diff --git a/packages/cli/src/view/ProjectView/index.tsx b/packages/cli/src/view/ProjectView/index.tsx
@@ -24,7 +24,6 @@ export interface Props {
 
 export const create = async ({ url, serverUrl, svgElement, rendererType, context, pathname, publicPath, filePathList }: Props) => {
   const workerURL = urljoin(publicPath, "assets", manifest["scripts/full.render.js"]);
-  const client = await ApiClient.create({ baseUrl: serverUrl, rendererType, isServer: true, workerURL });
 
   const publicPathname = isValidUrl(publicPath) ? new URL(publicPath).pathname : publicPath;
   const ssrProps: ServerSideRenderingProps = {
@@ -40,7 +39,7 @@ export const create = async ({ url, serverUrl, svgElement, rendererType, context
     rendererType,
     injection: {
       createSvgString: (source: string) => Promise.resolve(source),
-      client,
+      client: undefined,
     },
   };
   const body = (
diff --git a/packages/cli/src/view/ProjectView/template.tsx b/packages/cli/src/view/ProjectView/template.tsx
@@ -11,7 +11,6 @@ export interface Props {
 }
 
 export const create = (props: Props, csrProps: ClientSideRenderingProps) => {
-  const isClientRenderer = csrProps.rendererType === "client";
   return (
     <html lang="en">
       <head>
@@ -22,7 +21,9 @@ export const create = (props: Props, csrProps: ClientSideRenderingProps) => {
         <meta httpEquiv="X-UA-Compatible" content="ie=edge" />
         <script src={urljoin(csrProps.publicPath, routes.assets.path, manifest["scripts/react.production.min.js"])} />
         <script src={urljoin(csrProps.publicPath, routes.assets.path, manifest["scripts/react-dom.production.min.js"])} />
-        {isClientRenderer && <script src={urljoin(csrProps.publicPath, routes.assets.path, manifest["scripts/full.render.js"])} />}
+        {csrProps.rendererType === "client" && (
+          <script src={urljoin(csrProps.publicPath, routes.assets.path, manifest["scripts/full.render.js"])} />
+        )}
         <link href={urljoin(csrProps.publicPath, routes.assets.path, manifest["styles.css"])} rel="stylesheet" />
         <script
           dangerouslySetInnerHTML={{
diff --git a/packages/view/src/api/ClientRenderer.ts b/packages/view/src/api/ClientRenderer.ts
@@ -1,10 +1,11 @@
+import Viz from "viz.js";
+
 export interface Renderer {
   renderString: (dotSource: string) => Promise<string>;
 }
 
 export const create = async (rendererType: "client" | "server", workerURL: string) => {
   if (rendererType === "client") {
-    const Viz = (await import("viz.js")).default;
     const viz = new Viz({ workerURL });
     return {
       renderString: (dotSource: string) => viz.renderString(dotSource),
