Rivalry2

HTML Diff

0 added 0 removed

Original 2026-01-01

Modified 2026-03-10

1 Теги: python, web-разработка, web, <nav>, <main>, <header>, <footer>, <canvas>, <video>, web storage api, "key-value", localstorage, sessionstorage, webkit

2 Когда говорят HTML5, то обычно под этим словом понимают новые теги, например,<main>,<nav>,<header>и<footer>. Реже - рисование в<canvas>и проигрывание<video>. И чаще всего обходят сторонойWeb storage API.

3 Web storage API создано для замены морально устаревшихcookies, и имеет ряд преимуществ надcookies.

4 <h2>Рассмотрим данноеJavaScript APIпоближе</h2>

5 - ВсеCookiesхранятся в виде обычной текстовой строки в формате:

6 key1=value1; key2=value2;А различные пары "ключ-значение" могут храниться в одной строке. И, да, чтобы достать какое-то значение, необходимо достать все значения и разделять их.Web storageтоже хранит значения в виде "key-value", но работать с ним гораздо проще.

7 - Cookiesхранятся на стороне клиента и передаются на сервер при каждом запросе! Данные вWeb storageотносятся только к клиентской части и не передаются на сервер.

8 - Cookiesимеют время жизни и долгоживущиеCookiesне пропадут при закрытии окна браузера. Помимо этого нельзя никак привязать время жизниСookiesк закрытию окна, что необходимо для организации кэша.Web Storageсостоит из двух частей -LocalStorageиSessionStorage. По своей сути они полностью идентичны, c той лишь разницей, чтоSessionStorageпропадёт после закрытия окна браузера.

9 - Cookiesограничены по размеру - всего 4 Кб. Этого не хватит для хранения даже маленького документа.Web storageимеет ограничение в 5 Мб, чего более чем достаточно для хранения документа и/или большого дерева метаданных.

10 А если ограничиться, например, движкомWebKit, то работу сWeb storageможно построить по принципам реляционных баз данных. Да, и писать полноценные SQL для работы с этой БД.

11 Есть вопрос? Напишите в комментариях!