Update guide/api-environment-plugins.md and guide/api-environment-runtimes.md

Closes #175
Closes #177

Author: dragomano

docs/guide/api-environment-plugins.md

@@ -146,7 +146,7 @@ interface HotUpdateOptions {
 
 ## Состояние плагинов для разных окружений {#per-environment-state-in-plugins}
 
-Поскольку один и тот же экземпляр плагина используется для разных окружений, состояние плагина должно быть привязано к `this.environment`. Это соответствует подходу, уже используемому в экосистеме для хранения состояния модулей с использованием булева значения `ssr` в качестве ключа, чтобы избежать смешивания состояния клиентских и SSR-модулей. Для разделения состояния по окружениям можно использовать `Map<Environment, State>`. Обратите внимание, что для обратной совместимости хуки `buildStart` и `buildEnd` вызываются только для клиентского окружения, если не установлен флаг `perEnvironmentStartEndDuringDev: true`.
+Поскольку один и тот же экземпляр плагина используется для разных окружений, состояние плагина должно быть привязано к `this.environment`. Это соответствует подходу, уже используемому в экосистеме для хранения состояния модулей с использованием булева значения `ssr` в качестве ключа, чтобы избежать смешивания состояния клиентских и SSR-модулей. Для разделения состояния по окружениям можно использовать `Map<Environment, State>`. Обратите внимание, что для обратной совместимости хуки `buildStart` и `buildEnd` вызываются только для клиентского окружения, если не установлен флаг `perEnvironmentStartEndDuringDev: true`. То же самое для `watchChange` и флага `perEnvironmentWatchChangeDuringDev: true`.
 
 ```js
 function PerEnvironmentCountTransformedModulesPlugin() {
@@ -227,6 +227,43 @@ export default defineConfig({
 
 Хук `applyToEnvironment` вызывается во время конфигурации, в настоящее время после `configResolved`, поскольку проекты в экосистеме модифицируют плагины в нём. Разрешение плагинов окружения может быть перенесено на этап до `configResolved` в будущем.
 
+## Связь между приложением и плагином {#application-plugin-communication}
+
+`environment.hot` позволяет плагинам общаться с кодом на стороне приложения для данного окружения. Это эквивалент [связи «клиент-сервер»](/guide/api-plugin#client-server-communication), но поддерживает окружения, отличные от клиентского.
+
+:::warning
+
+Эта функция доступна только для окружений, поддерживающих HMR.
+
+:::
+
+### Управление экземплярами приложения {#managing-the-application-instances}
+
+Имейте в виду, что в одном и том же окружении может работать несколько экземпляров приложения. Например, если у вас открыто несколько вкладок в браузере, каждая вкладка — это отдельный экземпляр приложения с отдельным соединением к серверу.
+
+Когда устанавливается новое соединение, на экземпляре `hot` окружения эмитируется событие `vite:client:connect`. Когда соединение закрывается, эмитируется событие `vite:client:disconnect`.
+
+Каждый обработчик события получает `NormalizedHotChannelClient` в качестве второго аргумента. Клиент — это объект с методом `send`, который можно использовать для отправки сообщений этому конкретному экземпляру приложения. Ссылка на клиент всегда одинакова для одного и того же соединения, поэтому вы можете сохранять её для отслеживания соединения.
+
+### Пример использования {#example-usage}
+
+Сторона плагина:
+
+```js
+configureServer(server) {
+  server.environments.ssr.hot.on('my:greetings', (data, client) => {
+    // делаем что-нибудь с данными,
+    // и, если нужно, отправляем ответ этому экземпляру приложения
+    client.send('my:foo:reply', `Привет от сервера! Вы сказали: ${data}`)
+  })
+
+  // рассылаем сообщение всем экземплярам приложения
+  server.environments.ssr.hot.send('my:foo', 'Привет от сервера!')
+}
+```
+
+Сторона приложения аналогична связи «клиент-сервер». Вы можете использовать объект `import.meta.hot` для отправки сообщений плагину.
+
 ## Окружение в хуках сборки {#environment-in-build-hooks}
 
 Так же, как и во время разработки, хуки плагинов также получают экземпляр окружения во время сборки, заменяя булевый параметр `ssr`. Это также работает для `renderChunk`, `generateBundle` и других хуков, которые используются только во время сборки.

docs/guide/api-environment-runtimes.md

@@ -316,27 +316,45 @@ import { createServer, RemoteEnvironmentTransport, DevEnvironment } from 'vite'
 function createWorkerEnvironment(name, config, context) {
   const worker = new Worker('./worker.js')
   const handlerToWorkerListener = new WeakMap()
+  const client = {
+    send(payload: HotPayload) {
+      worker.postMessage(payload)
+    },
+  }
 
   const workerHotChannel = {
     send: (data) => worker.postMessage(data),
     on: (event, handler) => {
-      if (event === 'connection') return
+      // клиент уже подключен
+      if (event === 'vite:client:connect') return
+      if (event === 'vite:client:disconnect') {
+        const listener = () => {
+          handler(undefined, client)
+        }
+        handlerToWorkerListener.set(handler, listener)
+        worker.on('exit', listener)
+        return
+      }
 
       const listener = (value) => {
         if (value.type === 'custom' && value.event === event) {
-          const client = {
-            send(payload) {
-              worker.postMessage(payload)
-            }
-          }
           handler(value.data, client)
         }
       }
       handlerToWorkerListener.set(handler, listener)
       worker.on('message', listener)
     },
     off: (event, handler) => {
-      if (event === 'connection') return
+      if (event === 'vite:client:connect') return
+      if (event === 'vite:client:disconnect') {
+        const listener = handlerToWorkerListener.get(handler)
+        if (listener) {
+          worker.off('exit', listener)
+          handlerToWorkerListener.delete(handler)
+        }
+        return
+      }
+
       const listener = handlerToWorkerListener.get(handler)
       if (listener) {
         worker.off('message', listener)
@@ -363,6 +381,8 @@ await createServer({
 
 :::
 
+Убедитесь, что вы реализуете события `vite:client:connect` / `vite:client:disconnect` в методах `on` / `off`, когда эти методы существуют. Событие `vite:client:connect` должно эмитироваться при установке соединения, а событие `vite:client:disconnect` — при закрытии соединения. Объект `HotChannelClient`, передаваемый обработчику события, должен иметь одну и ту же ссылку для одного и того же соединения.
+
 Другой пример, использующий HTTP-запрос для взаимодействия между раннером и сервером:
 
 ```ts