材质 ui 图标加载使累积布局移位大

【问题标题】：Materail ui Icon load make big Cumulative Layout Shift材质 ui 图标加载使累积布局移位大
【发布时间】：2022-11-12 22:56:47
【问题描述】：

我有以下使用 React、Nextjs 和 Material ui 的网站

当页面加载时，我得到很大的累积布局偏移，这是由加载大的 svg 材料 ui 图标引起的，然后达到样式化的高度和宽度。

如何修复导致巨大的累积布局移位的图标大小变化？

如下图所示：

【问题讨论】：

【解决方案1】：

我有类似的经历，我不确定我做了什么有帮助，但似乎它已经消失了，我更改了所有图标导入

import {Menu as MenuIcon} from "@mui/icons-material";

至

import MenuIcon from "@mui/icons-material/Menu";

并从 Next 12 升级到 13，不确定哪个有帮助，但似乎是

【讨论】：