Tag Archives: Memòria cau

Home pobre de memòria cau en JavaScript

1 Resposta

[TL;DR versió: utilitza cookies per emmagatzemar els resultats de les trucades asíncrona; representar els resultats dels darrers asíncrona trucades immediatament i validar-los llavors després de càrrega de pàgina.]

He estat treballant en lloc d'intranet del SharePoint per a un client que inclou, entre altres coses, una estilitzada Navegació secundària les opcions del menú són gestionats mitjançant una llista personalitzada vell regular.  La idea és que el client obté controlar el menú del "seu" lloc sense afectar o estar afectat per la navegació per.

(hi ha alguna cosa increïblement subversiu sobre com afegir un CEWP que apunta a un fitxer HTML que carrega alguns CSS i JS per alterar fonamentalment gairebé tot sobre el comportament d'un lloc... però això és per a un altre lloc)

El codi per a aquesta força simples:

L'adolorit lloc aquí és que cada vegada que algú colpeja una de les pàgines del lloc, navegador web de l'usuari és arribar a tenir elements de la llista.  Un cop dev és completa i proves ha demostrat coses de ser estable i complet, Aquesta convocatòria és innecessari més de 99% de l'època ja que poques vegades la carta canvia.  També disposa d'un estrany efecte UI que és comú en aquest món nou i valent de llocs web hiper-ajaxy-rendeix la pàgina i llavors només fa rendir el menú.  És nerviós i distracció en la meva opinió.  I nerviós. Així, memòria cau. 

He modificat la lògica així:

  • Buscar una galeta al navegador que conté el menú com darrera llegir-lo
    • Si hem trobat, representar-lo immediatament.  No esperi per a acabar de carregar la pàgina.  (Vostè necessita assegurar-se que el seu HTML estratègicament situat aquí, però no és difícil de fer).
  • Espereu que la pàgina d'acabar de carregar i fer un asíncrona truqueu per carregar els elements de menú d'una llista, utilitzant la resta o lists.asmx o el que sigui
  • Comparar què aconseguia contra la galeta
    • Si coincideix amb el, PARADA
    • En cas contrari, utilitzant jQuery, poblar dinàmicament un grapat de si <li>és en una <ul>
  • Utilitzar CSS per fer tot el format
  • Benefici!

Alguns de vostès estan anant a dir, "Escolta! no hi ha cap veritable memòria cau passant aquí ja que vostè està llegint la carta de totes maneres cada vegada.”  I tens raó-no estic donant el servidor cap mena de descans.  Però perquè la crida és asíncrona i passa després la pàgina inicial càrrega HTML totalment rendeix, "se sent" més sensible a l'usuari.  El menú rendeix força tant com dibuixa la pàgina.  Si el menú passa al canvi, l'usuari se sotmet a un nerviós repetir el sorteig del menú, però només que una vegada.

Hi ha algunes maneres de fer aquesta memòria cau més eficaç i ajudar el servidor al mateix temps:

  • Posar en una regla que el "amagatall de galetes" és vàlida per un mínim de 24 hores o algun timeframe altre. Mentre no hi ha galetes expirats, utilitzar instantània de la galeta menú i mai va colpejar el servidor.

Bé... això és tot el que vénen a la ment ara mateix :). 

Si algú té alguna idea intel ligent aquí jo estimaria saber-los.

I finalment – aquesta tècnica pot ser utilitzat per altres coses.  Pàgina del aquest client té una sèrie de coses basades en dades sobre diferents pàgines, molts d'ells canviar relativament poques vegades (com un cop per setmana o un cop al mes).  Si la destinació de les àrees específiques de funcionalitat, es pot donar un UI més sensible per tirant contingut des de la botiga local de galeta i rendició immediatament.  Que se sent més ràpid a l'usuari fins i tot si vostè no els està salvant el servidor qualsevol cicles.  Vostè pot salvar els cicles de servidor per decidir sobre algunes condicions i factors desencadenants que invalida aquest amagatall de galetes local.  Això és tot situacional i artístic matèria i realment el més divertit :). 

</final>

undefinedSubscriure's al meu blog.

Follow me on Twitter http://www.twitter.com/pagalvin