javascript - Google PageSpeed Insights 显示未使用的 javascript 但已使用

Question

使用的 Javascripts 但谷歌页面速度洞察显示它没有被使用。无论如何我可以删除它。在这里，我分享 PageSpeedInsight 报告的屏幕截图。

在上面的屏幕截图中，您可以看到 8 个 js 文件未使用。但它正在我的应用程序上使用。

Answer 1

NOTE: This answer is due to confusion. The OP is not using React but the report includes the React example. This might be helpful to othersanyways.

如果您的组件是动态加载的(仅在用户请求之后)。
您可以使用 React.lazy()正如代码拆分报告中所建议的那样，这样您就不会在不需要时加载大包。
此解决方案适用于非 SSR。
之前:

import ComponentB from './ComponentB';

function ComponentA() {
  return (
    <>
        {/* After certain action probably like routes switch or any? */}
        <ComponentB />
    </>
  );
}

之后:

import React, { lazy } from 'react';
const ComponentB = lazy(() => import("./ComponentB.js"));

function ComponentA() {
  return (
    <>
        {/* After certain action probably like routes switch or any? */}
        <ComponentB />
    </>
  );
}

引用: https://reactjs.org/docs/code-splitting.html