Меня привлекает наглядный, лаконичный и очень быстрый рендеринг контента с sourcemaking.com. Да, он показывает контент очень быстро!
Эти вещи ниже будут изменены в соответствии с вашей навигацией по страницам:
- Расположение окна
- Заголовок страницы
- Метаданные
- Содержимое открытого графика
- И так далее…
Во-первых, мне пришла в голову мысль, что все дело в AngularJS.
Я проверяю сетевую панель в инструменте Chrome Dev, тогда нет запроса XHR на изменение навигации
Отключите JS, он загружает страницу как обычно.
Включите JS, волшебство снова появится!
Привязка данных здесь, но AngularJS здесь может быть не реализован! В html-контенте нет директивы ng.
Затем, наконец, оказывается, что localStorage используется на веб-сайте для хранения контента, а затем обрабатывает результат с помощью кода JQuery, смешивая шаблон с данными JSON.
В Chrome локальное хранилище ограничено примерно 5 МБ. Я использовал приведенный ниже фрагмент кода для расчета локального хранилища.
(function(){
var total = 0, part = 0, _1MB = 1024 * 1024;
for(var key in localStorage) {
// Length is multiplied by 2 as described in specification
// ref: http://www.ecma-international.org/ecma-262/6.0/#sec-terms-and-definitions-string-value
// 4.3.17 String value
part = (localStorage[key].length * 2) / _1MB;
total += part;
console.log( key + “ = “ + part.toFixed(2) + “ MB”);
}
console.log( “Total: “ + total.toFixed(2) + “ MB”);
})();
Тогда вот результат:
checkout_data = 0.00 MB content = 4.73 MB content_dynamic_time = 0.00 MB content_static_time = 0.00 MB dynamic_version = 0.00 MB static_version = 0.00 MB templates = 0.05 MB user_echo_sso_token = 0.00 MB Total: 4.78 MB.
Это довольно круто, не так ли?
Простое решение с локальным хранилищем, но с отличным пользовательским интерфейсом, и оно работает!
