HTML5 localStorage для активов (таблицы стилей, JavaScript, изображения и т.д.)

Чтобы сохранить как время загрузки клиента, так и использование сети, можно ли использовать функцию localStorage HTML5 для хранения содержимого связанных таблиц стилей, файлов javascript и двоичных данных (например, изображений), а не каждый раз нажимать на сервер?

Будет ли это просто усложнять ситуацию - поскольку я предполагаю, что вам придется добавлять связанный актив через JavaScript, а не только элемент script или link, нарушая страницу для тех, у кого есть JavaScript)? Если вы не сможете проанализировать содержимое (используя HEAD, запрошенный для проверки последней измененной даты и других заголовков), прежде чем браузер загрузит его.

Или лучше всего придерживаться заголовков 304 Not Modified и eTag?

Ответ 1

Я думаю, что в этом случае вам следует рассмотреть автономное кэширование:

https://developer.mozilla.org/en/Offline_resources_in_Firefox#Specifying_a_cache_manifest

Вы также можете хранить пользовательские входные данные в localStorage или sessionStorage:

Не используйте globalStorage (не стандартный).

Я написал статью об автономном режиме, см. http://hacks.mozilla.org/2010/01/offline-web-applications/

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

Ответ 2

Вы можете base64 кодировать ваши изображения/двоичные данные и хранить их как строку в localStorage, используя URL-адреса base64, не работает в нескольких браузерах, поэтому это не идеальное решение.

CSS и js будут в порядке, вы можете записать их на страницу или использовать также base64 url.

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