Tag Archives: Кеш

Бідна людина в кешування в JavaScript

[TL;DR версії: використовує кукі для зберігання результатів async дзвінків; візуалізації результатів останніх async дзвінків негайно а потім підтвердити їх після завантаження сторінки.]

Я працюю на intranet-сайті SharePoint для клієнта цієї функції, серед іншого, стилізований другорядного меню, чиї параметри меню керування через регулярні старі настроюваним списком.  Ідея полягає в тому, що клієнт одержує управління меню "своїх" сайт без зачіпають або під впливом глобальної навігації, згасити його.

(Існує щось неймовірно підривних про додавання CEWP, що вказує на файл HTML, який завантажує деякі CSS і JS докорінно змінити характер майже все про поведінку сайту..., але це на іншій посаді)

Код для цього дуже проста:

  • Чекати сторінку для завантаження і зробити async, зателефонуйте завантажувати до пунктів меню зі списку за допомогою відпочинку або lists.asmx або будь-який інший
  • Використання jQuery, динамічно заповнення букет, якщо <Лі>у всередині батьків <ul> (у Піндер християнський статті тут спрощене пояснення цього tecnnique)
  • Робити все форматування за допомогою CSS
  • Прибуток!

Хворе місце тут в тому, що кожного разу, коли хтось потрапляє одним із сторінки сайту, Цей користувач веб-браузер простягає руку отримати елементи зі списку.  Після того, як dev є повним і тестування довела речей, щоб бути стабільною і повний, цей заклик не є необхідним більше, ніж 99% часу, оскільки у меню рідко змінюється.  До нього дивні афекту користувальницький інтерфейс, який є спільним в цьому прекрасному новому світі гіпер ajaxy веб-сайтів-сторінка надає, і тільки потім меню візуалізації.  Це нервовий і відволікає, на мій погляд.  І нервовий. Так, кешування. 

Я змінив логіка константи виглядає:

  • Знайдіть файл cookie у веб-переглядачі, що містить меню, як я останній раз читав його
    • Якщо знайдено, зробити його негайно.  Чи не чекайте, сторінки завантаження.  (Ви повинні переконатися, що ваш HTML стратегічно розташованих тут, але це не важко зробити).
  • Чекати сторінку для завантаження і зробити async, зателефонуйте завантажувати до пунктів меню зі списку за допомогою відпочинку або lists.asmx або будь-який інший
  • Порівняти те, що я отримав від печива
    • Якщо він відповідає, Зупинити
    • В іншому випадку, використання jQuery, динамічно заповнення букет, якщо <Лі>в у в <ul>
  • Робити все форматування за допомогою CSS
  • Прибуток!

Деякі з ви збираєтеся сказати, "Ей! немає не реальних кешування тут відбувається так, як ви читаєте меню все одно кожен раз, коли.”  І ви маєте рацію-я не даю сервер будь-якого роду перерву.  Але тому що дзвінок async і відбувається після того, як сторінку від початкового Деструктивна HTML повністю надає, вона відчуває "себе" більш гнучкою для користувача.  Меню надає досить стільки, скільки сторінку малює.  Якщо меню відбувається до зміни, користувач піддається нервовий повторно перемальовувати меню, але що один раз.

Є кілька шляхів, щоб зробити цей кешування більш ефективним і допомогти на сервері в той же час:

  • Покласти в правило "куки кеш" дійсна протягом мінімум 24 годин або деякі інші терміни. Оскільки немає жоден файл cookie не прострочений, за допомогою файлу cookie, меню знімок і ніколи не потрапляють на сервері.

Добре..., що все, що спадає на думку прямо зараз :). 

Якщо хто має будь-які розумні ідеї тут я б із задоволенням їх знаємо.

І нарешті-ця техніка може бути використана для інших речей.  Цей клієнт сторінка має ряд динамічної речей на різних сторінках, багато хто з них відносно рідко змінюється (як раз на тиждень або раз на місяць).  Якщо ви націлюєте конкретних областях функціональності, можна надати більш гнучкою для користувача Інтерфейсу, потягнувши змісту з магазину місцевих печива й наданням негайно.  Вона відчуває себе швидше користувачеві навіть, якщо ви не записуєте сервер будь-якої циклів.  Ви можна зберегти сервер циклів, ухвалення рішення про деякі умовах і тригерів спростовувати кеш локальних файлів cookie.  Це все ситуаційні і претензійною речі і дійсно найвеселіше :). 

</кінець>

undefinedПідписатися на мій блог.

Йди за мною на Twitter в http://www.twitter.com/pagalvin