关键

你在你的WordPress网站上看到这个严重错误了吗？ WordPress有时可能会显示一条错误消息，称本网站出现严重错误。请查看您的站点管理员电子邮件收件箱以获取指导。它还将包括一个指向WordPress调试指南的链接。 在本指南中，我们将向您展示如何修复WordPress中的严重错误。我们还将讨论导致此错误的原因以及如何避免它。 它还会向您的WordPress站点的管理员电子邮件地址发送一封电子邮件。 此电子邮件包括有关导致错误的插件或主题的更多详细信息，以及在恢复模式下访问您的WordPress仪表板的链接。 此错误的另一个变体只会显示您的网站正面临严重错误。它不会指示您检查您的电子邮件地址。 这可能是因为WordPress无法加载恢复模式或发送电子邮件所需的文件。 这封电子邮件还包括一个独特的链接，允许您在恢复模式下登录到您的WordPress网站来调查和修复该问题。 在电子邮件的底部，您将看到有关该错误的更详细信息，包括触发该错误的特定文件和代码。 在下面的示例中，主题的unctions.php文件的第614行上的一些代码负责触发该错误。 这是另一个例子，显示了一个故障的WordPress插件导致的错误。 如您所见，该消息突出显示了插件名称和导致错误的代码行。 现在，您只需点击WordPress恢复模式的链接，即可进入您的WordPress管理区。 系统将要求您登录才能继续。 登录后，您将看到一条通知，告诉您有关严重错误的信息、导致该错误的原因以及指向修复位置的链接。 例如，在下面的屏幕截图中，WordPress通过一个指向Plugins页面的链接来通知我们插件导致的严重错误。 如果您点击该链接，它将向您显示问题插件。它还将向您显示导致错误的确切代码行。 你可以点击“停用”来暂时停用这个插件。 然后你可以简单地寻找一个替代的WordPress插件，或者看看你是否能从插件开发人员那里获得支持。 同样，如果问题出在您的主题上，您将看到一个指向主题页面的链接。在页面底部，它将说明是哪个主题导致了该问题。 您可以更改WordPress主题。或者，您可以删除损坏的文件，并从官方来源重新安装一个新的副本，看看这是否解决了问题。 解决问题后，请单击顶部的“退出恢复模式”按钮。 在大多数情况下，你的WordPress网站现在可以开始正常工作了。 但是，如果您仍然在WordPress中看到严重错误，您可以尝试下一节中的故障排除步骤。 在wp-Content文件夹中，你会看到一个叫做‘plugins’的文件夹。你需要右击它，然后选择“重命名”选项。 接下来，将“Plugins”文件夹名称更改为您喜欢的任何名称。在我们的示例中，我们将其命名为‘plugins.deactive’。 WordPress查找插件文件夹，以便在您的网站上加载激活的插件。当它找不到插件文件夹时，它就无法激活它们，并自动将它们设置为停用。 现在，您可以访问您的网站，查看严重错误消息是否已消失。 重要：如果严重的错误问题已经解决，不要忘记重命名‘plugins’文件夹。然后WordPress将识别该文件夹，你可以从WordPress仪表板逐个重新激活插件，以确定哪个插件导致了严重错误。 有关更多细节，请参阅我们的教程，了解如何停用所有WordPress插件。 2.切换到默认主题 排除严重错误的下一步是将WordPress主题切换到默认主题。如果当前WordPress主题中的某些代码导致了该问题，这将修复严重的错误问题。 只需转到WordPress.org主题目录，然后下载一个新的默认主题副本，如二十二或二十三。 接下来，您需要将主题文件解压缩到您的计算机。 这将在您的计算机上创建一个具有主题名称的文件夹。 现在，您需要使用主机控制面板中的FTP客户端或文件管理器应用程序连接到您的WordPress站点。 连接后，导航到/wp-Content/Themes文件夹，您将看到网站上安装的所有主题的列表。 继续下载所有这些文件夹到您的计算机作为备份。 在此之后，您需要从您的网站上删除所有主题文件夹。 您的WordPress站点现在没有安装主题。 要解决此问题，请上载您先前下载的默认主题文件夹。 一旦此过程完成，您可以尝试访问您的网站。 如果你的WordPress主题导致了严重错误，那么错误消息应该已经消失了，你就可以访问你的网站了。 3.重新安装WordPress 损坏的WordPress核心文件或恶意软件也可能在WordPress中触发严重错误。解决这个问题最简单的方法是重新安装WordPress。 只需访问WordPress.org并将新的WordPress副本下载到您的计算机上。 下载文件后，您需要将其解压缩到您的计算机。这将创建一个名为‘WordPress’的文件夹，其中包含重新安装所需的所有文件。 接下来，使用FTP客户端或主机控制面板中的文件管理器应用程序连接到您的WordPress站点。 连接后，导航到您的网站的根文件夹。这是包含wp-admin、wp-content、wp-includes和wp-admin文件夹的文件夹。 现在，选择您计算机上“WordPress”文件夹中的文件，并将它们上传到您的网站。 您的ftp客户端会询问您是要覆盖这些文件还是跳过它们。您需要选择“覆盖”并选中“始终使用此操作”旁边的框。 然后，只需点击“确定”按钮即可继续。您的ftp客户端现在将用您计算机上的新副本替换您的核心WordPress文件。 一旦完成，您可以尝试访问您的网站，看看这是否解决了错误。 如果严重错误是由损坏的WordPress核心文件或恶意软件引起的，那么错误消息现在应该会消失。 4.打开WordPress中的调试 […]

关键渲染路径是浏览器首先在屏幕上渲染页面所执行的一系列任务，即下载、处理并将HTML、CSS和JavaScript代码转换为实际像素并将它们绘制在屏幕上。 关键渲染路径优化是最小化浏览器执行序列的每个步骤所花费的时间的过程，优先显示与当前用户操作相关的内容。 此过程的大部分与无需向下滚动浏览器窗口即可看到的页面部分有关。该部分也称为“折叠上方（Above the Fold）”。为了更好的可用性，应该尽快渲染ATF，这可以通过至少减少网络往返次数来实现。渲染ATF所需的资源被认为是关键的，优化Above the Fold意味着将关键资源对首页渲染时间的影响降至最低。 在这篇文章中，我们将介绍关键渲染路径优化序列。 首先，我将概述浏览器呈现页面内容的任务。 接下来，我将剖析我们可以执行的最相关的操作来优化关键渲染路径。 最后，我将列出一些有用（且流行）的WordPress优化插件。 关键渲染路径序列 以下是浏览器为呈现页面而执行的一系列步骤： 首先，浏览器下载并解析HTML标记并构建DOM 然后它下载并处理CSS标记并构建CSS对象模型 它在渲染树中结合了渲染页面所需的DOM和CSSOM节点，渲染树是所有可见节点的树形结构 它计算页面上每个对象的尺寸和位置 最后，它在屏幕上绘制像素 DOM 正如Google的关键渲染路径优化指南中所解释的那样，浏览器按四步顺序构建文档对象模型： 首先，浏览器读取行字节并将它们转换为单个字符。 然后它将尖括号内的字符串转换为标记。 这些标记被转换为节点对象。 节点对象以树状数据结构链接，其中包含HTML内容、属性和节点之间的关系。这个结构就是文档对象模型。 这里需要注意的重要一点是浏览器是逐步构建DOM的。这允许我们通过创建高效的DOM结构来加速页面的渲染。 DOM结构 CSSOM 当解析器遇到一个引用外部CSS样式表的标签link时，它会阻止解析并发出对该资源的请求。收到CSS文件后，浏览器开始构建CSS节点的树形数据结构。 浏览器读取 .css 文件的行字节并将它们转换为单个字符 它将大括号内的字符串转换为标记 这些标记被转换为节点对象 节点对象以树状数据结构链接，其中包含每个节点的CSS属性以及节点之间的关系。这种结构就是CSS对象模型( CSSOM )。 与DOM构建不同，CSSOM构建不是增量的。浏览器不能使用样式表的一部分，因为样式可以在同一个样式表中进行细化和重新声明。出于这个原因，浏览器会阻塞渲染过程，直到它接收并解析所有CSS。这意味着CSS是渲染阻塞的。 CSSOM结构 渲染树 浏览器将DOM和CSSOM组合到渲染树中，最终的树结构包含用于将页面渲染到屏幕的所有节点和属性。 渲染树仅包含渲染页面所需的节点。结果，忽略了不可见的节点。 浏览器使用渲染树计算节点尺寸和位置作为绘画过程的输入。 渲染树结构 布局和绘制 在布局阶段，浏览器计算渲染树每个节点的尺寸和位置。浏览器从根开始遍历渲染树，并在此阶段生成一个盒子模型。该信息最终用于将渲染树的每个节点转换为屏幕上的实际像素。 关键渲染路径优化 运行整个过程所需的时间是可变的。这取决于文档大小、请求数量、应用的样式、用户设备等。最相关的Google建议之一是优先考虑可见内容以尽可能快地呈现“首屏”，并提供两个主要规则跟随： 构建HTML以首先加载关键的首屏内容 减少HTML、CSS和JS资源使用的数据量 正如Google的PageSpeed指南中所解释的那样，如果渲染ATF所需的数据量超过了初始拥塞窗口 (14.6kb)，则需要在服务器和浏览器之间进行额外的网络往返。在具有高延迟的移动网络上，这将显着延迟页面加载（阅读有关延迟的更多信息）。浏览器以增量方式构建DOM，允许我们通过构建HTML以首先加载首屏并延迟页面的其余部分来减少渲染ATF所需的时间。 折叠上方的内容因用户设备而异 但是优化并不会随着构建有效的DOM结构而结束。相反，它是一个涉及整个关键渲染路径序列的改进和测量过程。 让我们深入研究。 最小化资源维度 我们可以通过压缩、压缩和缓存HTML、CSS和JavaScript资源来减少浏览器要下载的数据量： 最小化是从源代码中删除不必要的字符（如注释和空格）的过程。这些字符在开发中很有帮助，但它们对于渲染页面没有用。 […]

如今，速度就是一切。浏览器会尝试缓存网页上的内容以加快加载速度。有很多方法可以通知浏览器缓存什么、何时缓存以及缓存内容保留多长时间。 预加载就是这样一种缓存功能，有助于提高WordPress网站的页面加载速度。但是，这可能会在Google PageSpeed Insights工具中使用的Google Lighthouse报告中产生错误。 在本文中，让我们解释如何解决PageSpeed Insights中由于字体导致的预加载关键词请求问题。 如何使用预加载？ 预加载，顾名思义，就是在页面开始加载时，通知浏览器立即开始缓存网页上的资源。这将有助于缓存稍后需要的CSS、脚本和字体。您可以在这篇Google开发人员文章中了解有关预加载的更多信息。 基本上，preload是HTML链接标签中rel属性的值。以下是在您的网站上使用预加载请求的语法： <link href=”font.woff” as=”style”> 对于网站上加载的每个CSS、脚本和字体文件，您需要在HTML的head标签之间插入此链接标签。 预加载的Google PageSpeed问题 虽然预加载会加快加载时间，但应该正确使用。使用PageSpeed Insights工具检查您的网站，看看是否有任何机会因预加载请求而可用。下面是一个示例，显示由于预加载关键请求，您可以节省7.05秒。 单击向下箭头时，您将看到导致延迟的所有相关内容。在这种情况下，都是网页上加载的字体。 PageSpeed Insights中的预加载关键词请求错误 WordPress插件和预加载 现在，您可能会对WordPress网站的Google PageSpeed报告中显示的预加载方式感到困惑。您会收到此错误的原因有很多： 通过在CSS中导入的主题和插件加载字体。 您正在使用像WP Rocket这样的缓存插件来预加载页面但不预加载字体。 您正在使用带有Google AdSense等广告的第三方字体或使用插件在您的网站上加载字体很棒的图标。 缓存插件将预加载请求键添加到所有资源。但是，使用@font-face在CSS中导入的字体不会使用预加载键请求。PageSpeed显示的错误可能是由于站点加载的字体未使用预加载键所导致。 如何修复由于字体导致预加载关键请求问题？ 您可以通过在PageSpeed中显示的那些资源的站点标题上手动添加预加载键来消除错误。但是，也有一些插件可以自动在您的标题上插入元标记。我们将解释手动和插件方法。 使用WP Rocket修复Google PSI中的预加载关键词请求 首先，我们将使用WP Rocket插件进行说明，因为它很简单，您不需要修改PHP文件。 使用WP Rocket包括字体预加载 WP Rocket是一款高级缓存插件，可让您预加载字体。如果您使用的是WP Rocket，请转到“设置 > WP Rocket > Preload”部分。将字体资源的相对URL粘贴到“Preload fonts”文本框下并保存更改。这将帮助您摆脱Google PageSpeed Insights工具中的预加载请求问题。请记住，相对URL的格式应为“/wp-content/themes/your-theme-name/font-file-name”（主题字体）和“/wp-content/plugins/plugin-name/font-file-name”（用于插件加载的字体）。 在WP Rocket插件中预加载字体 WP Rocket优化了许多其他功能，例如关键CSS生成、DNS预取和在本地托管Google Analytics等第三方脚本。因此，使用WP […]