如何在多个选项卡中保持 chrome 扩展同步
How to keep a chrome extension in sync in multiple tabs
我正在尝试创建一个 chrome 扩展程序，它将在多个选项卡上可用，我想知道执行此操作的最佳方法是什么。
为简单起见，假设扩展只显示一个数字，当该数字在一个选项卡中发生变化时，它必须在所有选项卡中发生变化。
环顾四周，找不到有关以下内容的信息：
- 先运行哪个 - 后台还是内容脚本？
- 我应该使用长期连接还是单发消息？
- 从内容还是从后台创建长期连接最好？
- 是否最好使用存储和存储更改事件而不是消息？
- 我应该为每个内容脚本维护单独的端口还是使用一个与断开连接一起使用？
这些问题可能是错误的，因为我可能以错误的方式解决这个问题。
谁能告诉我最佳做法。
这些问题中的任何一个都可以有比答案更多的东西，所以 TL;DR /“最佳实践”是保持简单，不要过于复杂，至少在一开始是这样，如果足够好，就到此为止。可以使用任何 JS 计时 API 或在 devtools 时间线分析器中衡量它在性能方面是否足够好。
What runs first - background or content script?
在 Chrome 中，这很棘手：在浏览器启动期间，如果启用了浏览器选项以恢复之前的会话（或在启动时打开网页），那么活动选项卡的内容脚本将首先加载，然后是背景脚本，然后是其他选项卡的内容脚本。如果浏览器已经运行，则取决于后台脚本是否持久：持久的脚本在用户配置文件初始化时仅启动一次，非持久的仅在有 API 事件时运行，或者如果它尚未从上一个 API 事件中终止。
在 Chrome 中，用 "persistent": false 声明的后台脚本仅在必要时启动，在您为其添加侦听器的 API 事件上，然后在 15 秒后终止不活动。在 ManifestV3 中，service worker 用于后台脚本，因此超时为 30 秒。
在 FF 中，后台脚本只能是持久的，它总是先运行。
Should I use a long lived connection or single shot messages?
在 99.999% 的情况下，一条消息就足够了。只有在极少数情况下才真正需要长期连接，例如 a) 如果您每秒向每个选项卡发送数十条或更多消息，b) 如果您需要手动跟踪断开连接事件，c) 其他一些我不需要的罕见情况马上记住。
Is it best to create a long lived connection from the content or from the background?
来自内容脚本，否则您需要猜测该选项卡是否已经 运行 您的内容脚本（如果您这样做太早，它将被忽略）或等待它的 'DOMContentLoaded' 事件，但如果您想处理页面加载过程的早期阶段，那可能为时已晚。
Is it best to use storage and storage change events instead of messages?
视情况而定。例如，在一些简单的情况下，onChanged 事件将允许您完全摆脱后台脚本。如果存储中的大部分更改都与内容脚本的行为相关，那么这样的事件将很有意义，但是如果您为不相关的内容修改了很多存储，那么这样的事件将在每个选项卡中徒劳地触发内容脚本运行。
Should I maintain separate ports for each content script or use one along with disconnect?
每个端口本质上都是不同的，因为没有单一的内容脚本：每个 tab/frame 都运行自己的内容脚本实例。就像从相同 URL.
加载它的 10 个选项卡中的每一个都会使用相同 jquery.js 的实例一样
我正在尝试创建一个 chrome 扩展程序，它将在多个选项卡上可用，我想知道执行此操作的最佳方法是什么。
为简单起见，假设扩展只显示一个数字，当该数字在一个选项卡中发生变化时，它必须在所有选项卡中发生变化。
环顾四周，找不到有关以下内容的信息：
- 先运行哪个 - 后台还是内容脚本？
- 我应该使用长期连接还是单发消息？
- 从内容还是从后台创建长期连接最好？
- 是否最好使用存储和存储更改事件而不是消息？
- 我应该为每个内容脚本维护单独的端口还是使用一个与断开连接一起使用？
这些问题可能是错误的，因为我可能以错误的方式解决这个问题。
谁能告诉我最佳做法。
这些问题中的任何一个都可以有比答案更多的东西，所以 TL;DR /“最佳实践”是保持简单，不要过于复杂，至少在一开始是这样，如果足够好，就到此为止。可以使用任何 JS 计时 API 或在 devtools 时间线分析器中衡量它在性能方面是否足够好。
What runs first - background or content script?
在 Chrome 中，这很棘手：在浏览器启动期间，如果启用了浏览器选项以恢复之前的会话（或在启动时打开网页），那么活动选项卡的内容脚本将首先加载，然后是背景脚本，然后是其他选项卡的内容脚本。如果浏览器已经运行，则取决于后台脚本是否持久：持久的脚本在用户配置文件初始化时仅启动一次，非持久的仅在有 API 事件时运行，或者如果它尚未从上一个 API 事件中终止。
在 Chrome 中，用 "persistent": false 声明的后台脚本仅在必要时启动，在您为其添加侦听器的 API 事件上，然后在 15 秒后终止不活动。在 ManifestV3 中，service worker 用于后台脚本，因此超时为 30 秒。
在 FF 中，后台脚本只能是持久的，它总是先运行。
Should I use a long lived connection or single shot messages?
在 99.999% 的情况下，一条消息就足够了。只有在极少数情况下才真正需要长期连接，例如 a) 如果您每秒向每个选项卡发送数十条或更多消息，b) 如果您需要手动跟踪断开连接事件，c) 其他一些我不需要的罕见情况马上记住。
Is it best to create a long lived connection from the content or from the background?
来自内容脚本，否则您需要猜测该选项卡是否已经 运行 您的内容脚本（如果您这样做太早，它将被忽略）或等待它的 'DOMContentLoaded' 事件，但如果您想处理页面加载过程的早期阶段，那可能为时已晚。
Is it best to use storage and storage change events instead of messages?
视情况而定。例如，在一些简单的情况下，onChanged 事件将允许您完全摆脱后台脚本。如果存储中的大部分更改都与内容脚本的行为相关，那么这样的事件将很有意义，但是如果您为不相关的内容修改了很多存储，那么这样的事件将在每个选项卡中徒劳地触发内容脚本运行。
Should I maintain separate ports for each content script or use one along with disconnect?
每个端口本质上都是不同的，因为没有单一的内容脚本：每个 tab/frame 都运行自己的内容脚本实例。就像从相同 URL.
加载它的 10 个选项卡中的每一个都会使用相同 jquery.js 的实例一样