为什么创建窗口比重新加载窗口慢答案

【问题标题】：Why is creating a window slower than reloading it为什么创建窗口比重新加载窗口慢
【发布时间】：2018-01-20 05:07:19
【问题描述】：

上下文：我将解释这个问题的上下文，但我认为这个问题的答案不是很具体。

我有一个 chrome 的背景页面，一个 chrome 扩展。该页面执行以下操作：

chrome.commands.onCommand.addListener(function(){
    chrome.windows.create({
        url:"page.html",
        type:'popup'
    });
});

如您所见，当用户触发命令（通过使用热键）时，这会创建一个新窗口，从我的扩展程序中加载 page.html 文件。

page.html 页面是一个相当重的页面。它运行一堆脚本（都来自扩展目录）和一堆图像（也都来自扩展目录）。

上下文要点：这里重要的是页面完全在本地加载。没有任何东西（直到用户输入）调用互联网，当我离线时它加载得很好。

问题：

当我通过触发事件加载窗口时，如上所述，加载需要一些时间，假设可能是 1.5 秒。如果我然后刷新新窗口（page.html），它会在不到 0.5 秒的时间内加载。造成这种时间差异的原因是什么？
如何利用更快的刷新率来加快初始页面加载速度？我可以以某种方式加载隐藏版本吗？或者以某种方式预渲染它？任何建议都将不胜感激。

【问题讨论】：

当您刷新页面时，您不需要再次抓取所有内容。许多占用大量加载时间的图像可以保留。在任何网站上尝试。刷新总是比打开新网页快
这并不能解释所有内容都在本地文件夹中的情况。
我假设的本地文件夹在被调用之前不在 RAM 中。因此，即使不涉及网络，将图像从硬盘加载到 RAM 也比图像已经在 RAM 中花费更多的时间。我假设 chrome 也做了一些偷偷摸摸的东西与缓存以及其他技巧，以使页面加载更快
嗯，其中一部分将是在内存中创建窗口对象的开销（chrome [表示窗口边框、大小调整器等]、渲染引擎等）。重新加载时不需要发生这种情况。
在 Windows 系统上评估加载或重新加载的速度是幻想，因为船长是其他一切（Windows 8 ,81,10），而不是您感兴趣的应用程序。所以即使您也会出现随机延迟禁用正常或以某种方式禁用：Windows 防火墙、Defender 等将在您的 Chrome 之外出现延迟。我认为其他操作系统也发生了类似的事情。在我的系统上，微软强制执行了几件事情被禁用，我可以复制你的情况（无法解释的延迟）计算解析执行时间微秒的 php 脚本。我有类似的结果

【解决方案1】：

关于第一个问题：

刷新页面不会导致所有内容（如渲染引擎）再次初始化。根据浏览器的实现，浏览器会在缓存中保留大量资源，当再次访问相同的 URL（本例中为页面刷新）时，会从缓存中加载资源，这样更快。因此造成时间上的差异。

关于第二个问题：

@elfin Forest 的回答可能会给您一些见解。

【讨论】：

当您说“缓存”时，您指的是什么？我的理解是缓存只是节省了网络时间。如果所有文件都已经是本地文件，为什么会更快？
我指的是浏览器的存储。是的，它确实节省了网络时间，但它的作用远不止于此。当页面第一次加载时，无论页面存储在本地还是在某个服务器中，浏览器都会缓存（或存储）页面的某些部分（取决于其实现）它是存储。因此，当页面下次加载时（在您的情况下是刷新），它会从内存中获取页面，而不是在本地获取页面。从缓存中获取数据比在本地获取数据要快。您可以查看（并清除）构建缓存的大小。(technipages.com/google-chrome-clear-cache)
@WaleedIqbal “@elfin Forest 的回答可能会给你一些见解”是什么意思？看不到答案或任何说明如何加快窗口创建的内容。非常感谢您的解决方案！
好像他的答案现在被删除了。

【解决方案2】：

如果您在开发人员工具打开时右键单击“重新加载”按钮，则会获得三个选项。

正常重新加载

这是默认设置（按 F5）。这将使用缓存，但在页面加载期间重新验证所有内容，寻找“304 Not Modified”响应。 如果浏览器可以避免重新下载缓存的 JavaScript 文件、图像、文本文件等，那么它会的。这可能是您获得速度差异的原因。

硬重新加载

发出请求时不使用缓存中的任何内容。它强制浏览器重新下载每个 JavaScript 文件、图像、文本文件等。

清空缓存和硬重新加载

这是第三个选项，它会清除缓存然后重新加载。

尝试其余两种形式的重载，如果速度差异仍然明显，请报告。

【讨论】：

【解决方案3】：

当您刷新页面时，Google 已经拥有运行脚本所需的所有数据。这意味着，当您刷新脚本时，它所要做的就是运行，从而消除了收集数据所需的 1 秒时间。

【讨论】：