4

在研究<iframe>有关 Chrome 扩展程序的问题时<webview>,Chrome 应用程序中的应用程序引起了我的注意并引起了我的兴趣。

所以我决定做一个我面临的问题的小例子,<iframe>看看是否<webview>能解决。根据我对观看 Chrome Dev 视频的理解,webview运行在与您的应用程序不同的进程中;它没有与您的应用相同的权限。所以我假设如果运行中的内容以某种方式与“主线程”(应用程序)分开,我猜它们的内容将彼此分开执行,而不是阻塞应用程序或其他,以防它们中的任何一个可能有可能长时间运行的 js 执行。因此我做了以下事情:

背景.js

chrome.app.runtime.onLaunched.addListener(function() {
  // Tell your app what to launch and how.
  chrome.app.window.create('window.html', {
      width: 1800,
      height: 1000
  });
});

清单.json

{
  // Required
  "name": "Hello World!",
  "version": "0.1",
  "manifest_version": 2,

  // Recommended
  "description": "My first packaged app.",
  "icons": { "16": "calculator-16.png", "128": "calculator-128.png" },
  // "default_locale": "en",

  // Pick one (or none) OF browser_action, page_action, theme, app 

  "app": {
    "background": {
      "scripts": [ "background.js" ]
    }
  },

  "minimum_chrome_version": "23",

  "permissions": [ "webview" ]

}

窗口.html

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div>Hello, world!</div>
    <webview id="wv1" style="width: 450px; height: 300px; border: 2px solid red" src="http://www.google.com"></webview>
    <webview id="wv2" style="width: 450px; height: 300px; border: 2px solid red" src="http://www.nytimes.com"></webview>
    <webview id="wv3" style="width: 450px; height: 300px; border: 2px solid red" src="http://www.stackoverflow.com"></webview>
    <webview id="wv4" style="width: 450px; height: 300px; border: 2px solid red" src="http://db.tt/FCCA7nuz"></webview>
  </body>
</html>

其中三个网页视图是普通网页,第四个只是一个长时间运行的 js 文件的示例,您可以检查代码,或者我可以稍后提供。如果我打开 4 个 google chrome 浏览器窗口,输入地址,按回车键,我会观察到:3 个页面立即加载,而另一个长时间 js 执行的页面仍然可以工作。

如果我在网页中执行此操作,用于打开这 4 个网页,因为它们都在同一个进程中,如果 1 个页面由于 js 执行而变慢/阻塞,则所有其他页面都将被阻止。

现在使用 Chrome 应用程序,我注意到这种行为有一些有趣和奇怪的地方。我注意到以下内容:

  1. 如果我只加载前 3 个网页,加载速度很快并且“同时”出现;
  2. 如果我按原样加载所有网页,我会看到前 3 个页面正在加载,最后一个页面因为它有很长的 js 执行需要他的时间然后它显示(这将是最佳行为),因为它们是不同的过程,它们应该'不依赖于 webview 是否慢,其他人必须等待;
  3. 现在,如果我评论第三个,刷新并执行应用程序,我看不到 webview,直到完成 longscript 的那个。(为什么会这样?)
  4. 上面的一点是随机的,要么发生如我所提到的,要么没有发生。
  5. 最后,让我们添加另一个<webview id="wv5" style="width: 450px; height: 300px; border: 2px solid red" src="http://developer.chrome.com"></webview>,对我来说会发生什么:前三个被加载,第四个正在执行,完成并显示后,我看到第五个渲染。

我的主要问题/怀疑是围绕行为,因为它们实际上是在一个单独的进程中运行,为什么它没有与浏览器窗口相同的行为,例如,为什么那个 webview 会阻止其他人工作/渲染,是不是有意的照原样工作?我是否应该做一些变通方法来检测一段时间后的 webview 是否没有完成以跳过负载并让其他人加载,这样我就可以回到慢速浏览器了?

先感谢您。

4

1 回答 1

9

Webview 与您的应用程序在不同的进程中运行,但它们在同一分区中彼此的相同进程中运行。如果您不指定分区属性,它们将位于相同的默认值中。如果您检查 Chrome 任务管理器 (shift+esc),您将看到: 在此处输入图像描述

(注意进程 ID 列)

如果您改为使用 tag 属性将每个 webview 设置为不同的分区:

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div>Hello, world!</div>
    <webview id="wv1" partition="p1" style="width: 450px; height: 300px; border: 2px solid red" src="http://www.google.com"></webview>
    <webview id="wv2" partition="p2" style="width: 450px; height: 300px; border: 2px solid red" src="http://www.nytimes.com"></webview>
    <webview id="wv3" partition="p3" style="width: 450px; height: 300px; border: 2px solid red" src="http://www.stackoverflow.com"></webview>
    <webview id="wv4" partition="p4" style="width: 450px; height: 300px; border: 2px solid red" src="http://db.tt/FCCA7nuz"></webview>
  </body>
</html>

您将看到每个 webview 现在都在自己的进程中运行:

在此处输入图像描述

于 2013-05-20T02:09:57.397 回答