Могу ли я сохранить javascript в локальном хранилище и запустить его?

Позвольте мне объяснить. Я разрабатываю приложение javascript, чтобы помочь людям разрабатывать веб-сайты. Я просто не понимаю, что он делает, просто знайте, что он работает, накладывая свой html/inline css-интерфейс на разрабатываемый веб-сайт и предлагая множество инструментов, таких как трассировка изображений и код minifiers.

Я храню его на сервере как .js файл. Все, что нужно сделать для доступа к моему приложению, - это скопировать и вставить на свою страницу небольшой фрагмент html, например:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="www.example.com/application.js">
<div class="application"></div>

Затем html и встроенный css интерфейса вставляются в div приложения, используя функцию jquery.html().

Все работает отлично.

Помимо одной вещи. Время загрузки. По мере того, как пользователь разрабатывает свой сайт, они будут постоянно обновлять свою страницу, и это приводит к тому, что им приходится ждать около 3 секунд (очень раздражает время) для загрузки интерфейса приложения.

Конечно, если кеш браузера включен, проблема исчезает, но если вы разрабатываете сайт, вы захотите отключить кеш-память! Это головоломка.

Затем я решил использовать локальные объекты хранилища для хранения строк интерфейса svg-графики, а затем .html() эти строки в inline css. Это полезное решение, но только разработчики будут использовать этот инструмент. Это не конечный пользователь. И это прекрасно работает, но дело в том, что браузеру все равно нужно загрузить script, чтобы узнать, как получить доступ к локально сохраненным изображениям! Скорость процессора не является узким местом, это пропускная способность.

Итак, я думал о сохранении самого script в локальном объекте хранилища и имел небольшую инициализацию script для его запуска.

Инициализация script будет просто извлекать script из локального объекта строковой привязки в виде строки, проанализировать ее соответственно и затем запустить.

Повторить мой вопрос, запустив его, это часть, которую я не могу сделать! Я могу вставить script на страницу через .html(script), но как я могу ее запустить?

Ответ 1

При использовании eval(myScript) - самый прямой подход, я предпочитаю это:

var script = document.createElement('script');
script.src = 'data:text/javascript,' + encodeURI(myScript);
script.onload = function() {
  //optional callback
};
document.body.appendChild(script);

Это вставка фактического тега script с использованием uri данных в качестве источника. Таким образом, он появится под "сценариями" на вкладке ресурсов инструментов dev. Когда загружается script, будут выполняться данные uri (ваш код).

Ответ 2

Вот два метода:

Способ 1: eval()

eval(localStorage.myCode);

Способ 2: конструктор Function

new Function(localStorage.myCode)();

Вот демон jsfiddle, показывающий, что все они работают:

Способ 1: http://jsfiddle.net/markasoftware/3BkAV/

Способ 2: http://jsfiddle.net/markasoftware/j6JAz/

Ответ 3

Вам просто нужно использовать функцию JavaScript eval.

Вы можете написать что-то вроде следующего:

localStorage.myCode = "alert('just a test')";
eval(localStorage.myCode);

Вы можете проверить, сохранен ли ваш код следующим образом:

if (!localStorage.myCode) {
    // local storage code not exists, load from somewhere else
} else {
    // perform the eval using the code from local storage
}

Я тестировал этот код в Chrome и работал. Единственная проблема, которую я вижу, это то, что вы заставляете своих пользователей использовать только браузеры, поддерживающие локальное хранилище.

Вот поддержка браузера:

IE 8 +
FireFox 3.5 +
Safari 4 +
Chrome 4 +
Opera 10.5 +