Будущее Javascript: вход в ShadowRealms

Звучит мрачно и загадочно, но это просто еще одна будущая функция Javascript. ShadowRealm — это новая функция, появившаяся в Javascript, которая позволит нам создать отдельный глобальный контекст, из которого будет выполняться Javascript. В этой статье мы рассмотрим, что такое ShadowRealm и как он работает.

Поддержка ShadowRealms в Javascript

«ShadowRealm» — это предложение Javascript, в настоящее время находящееся на этапе 3. Таким образом, «ShadowRealm» не имеет поддержки в браузерах или изначально в серверных языках, таких как Node.JS, и, учитывая, что за эти годы в него было внесено много изменений, нет стабильного плагина babel или npm для полифилла функциональности. Однако, учитывая, что он достиг стадии 3, это означает, что в будущем не будет очень много изменений, и мы можем ожидать, что ShadowRealms будет иметь встроенную поддержку в какой-то момент в будущем.

Как работает ShadowRealms в Javascript

«ShadowRealm» — это, в конечном счете, способ настроить совершенно новую среду с другим глобальным объектом, отделив код от других областей. Когда мы говорим о глобальном объекте в Javascript, мы имеем в виду понятие «окно» или «глобальное это». Проблема, которую в конечном счете пытается решить ShadowRealm, состоит в том, чтобы уменьшить конфликт между различными наборами кода и обеспечить безопасную среду для выполнения и запуска кода, который необходимо запускать изолированно. Это означает меньшее загрязнение глобального объекта другими частями кода или пакетами. Таким образом, код внутри ShadowRealm не может взаимодействовать с объектами в других областях.

Варианты использования ShadowRealm:

1. Редакторы кода, в которых пользователь может редактировать код и которые мы не хотим взаимодействовать с главной веб-страницей.

1. Плагины, которые можно запускать самостоятельно.

1. Эмуляция DOM в отдельной среде, т.е. если нам нужно знать позицию прокрутки в определенных сценариях, мы можем эмулировать ее в ShadowRealm, чтобы пользователь, прокручивающий главную веб-страницу, не влиял на переменную window.top в наша эмуляция.

ShadowRealms работает в том же потоке, что и все остальные Javascript, поэтому, если вы хотите сделать свой Javascript многопоточным, вам все равно придется использовать Web Workers. Таким образом, ShadowRealm может существовать внутри рабочего процесса, а также в обычном файле Javascript. ShadowRealms могут даже существовать внутри других ShadowRealms.

Создание ShadowRealm в Javascript

Давайте посмотрим, как ShadowRealm на самом деле выглядит в коде. Первое, что нам нужно сделать, это вызвать новый экземпляр ShadowRealm. Затем мы можем импортировать некоторый Javascript в нашу область, которая будет работать в ней. Для этого мы используем функцию с именем importValue, которая эффективно работает так же, как импорт.

```javascript

let myRealm = new ShadowRealm();

let myFunction = await myRealm.importValue('./function-script.js', 'analyseFiles');

// Теперь мы можем запустить нашу функцию в нашем ShadowRealm

пусть fileAnalysis = myFunctions();

В приведенном выше примере, analyseFiles — это имя экспорта, которое мы импортируем из function-script.js. Затем мы захватываем и сохраняем этот экспорт в myFunction. Примечательно, что экспорт, который мы импортируем в нашу область, должен быть вызываемым, поэтому он должен быть функцией, которую мы можем запустить.

Наш файл function-script.js — это обычный файл Javascript с экспортом. Это может выглядеть примерно так:

```javascript

функция экспорта analyseFiles() {

console.log('привет');

ShadowRealm полностью отделен от других глобальных объектов, которые у нас могут быть, таких как окно или глобальный this.

Подобно другим импортам, мы можем использовать запись импорта в фигурных скобках:

```javascript

let myRealm = new ShadowRealm();

const { runFunction, testFunction, createFunction } = await myRealm.importValue('./function-script.js');

let fileAnalysis = runFunction();

Или мы можем создать несколько промисов, которые все преобразуются в массив, если мы хотим использовать именованный importValues.

```javascript

let myRealm = new ShadowRealm();

const [runFunction, testFunction, createFunction] = await Promise.all([

myRealm.importValue('./file-one.js', 'runFunction'),

myRealm.importValue('./file-two.js', 'testFunction'),

myRealm.importValue('./file-three.js', 'createFunction'),

let fileAnalysis = runFunction();

Выполнение кода с помощью evaluate в ShadowRealms

Если мы хотим выполнить код непосредственно в ShadowRealm, а не из другого файла, мы можем использовать метод оценки в нашем ShadowRealm для выполнения строки Javascript. Это работает почти так же, как eval():

```javascript

let myRealm = new ShadowRealm();

myRealm.evaluate(console.log('привет'));

ShadowRealm importValue можно затем

Так как importValue возвращает обещание, его значение может быть изменено. Это означает, что мы можем использовать then() для него, а затем что-то делать с функцией вывода, которую он возвращает. Например:

```javascript

window.myVariable = 'привет';

let myRealm = new ShadowRealm();

myRealm.importValue('someFile.js', 'createFunction').then((createFunction) => {

// Сделайте что-нибудь с помощью createFunction();

console.log(окно.myVariable); // Возвращает неопределенное

Мы также можем использовать эту методологию для доступа к глобальным переменным, определенным в someFile.js. Например, предположим, что мы изменили someFile.js на это:

```javascript

globalThis.name = "fjolt";

функция экспорта returnGlobals (свойство) {

вернуть globalThis[свойство];

Теперь в нашей функции then мы можем получить значение globalThis.name:

```javascript

window.myVariable = 'привет';

let myRealm = new ShadowRealm();

myRealm.importValue('someFile.js', 'returnGlobals').then((returnGlobals) => {

// Сделайте что-нибудь с returnGlobals();

console.log(returnGlobals("имя")); // Возвращает фьолт

console.log(окно.myVariable); // Возвращает неопределенное

Заключение

Сегодня iframe — это то, как мы обычно разделяем отдельные среды в Интернете. `iframe’ы неуклюжи и могут быть довольно раздражающими при работе. С другой стороны, ShadowRealms более эффективны, позволяют нам легко интегрироваться с нашей существующей кодовой базой и хорошо интегрироваться с современными технологиями Javascript, такими как [Web Workers] (https://fjolt.com/article/javascript-webworkers).

Учитывая их уникальное ценностное предложение по предоставлению отдельной области для выполнения кода, которая вообще не взаимодействует с остальной частью кодовой базы, ShadowRealms, вероятно, станет основным продуктом при написании кода Javascript. Они могли бы стать важным способом для пакетов и модулей экспортировать свое содержимое, не беспокоясь о помехах со стороны других частей кодовой базы. Таким образом, ожидайте, что они появятся в будущем.

Читайте о спецификации ShadowRealm здесь.

• Впервые опубликовано [здесь] (https://fjolt.com/article/javascript-shadowrealms)*