คนดีของแคใน JavaScript

[TL;รุ่น DR: ใช้คุกกี้เพื่อเก็บผลลัพธ์ของการเรียกต่างเวลา; แสดงผลผ่านมาต่างเวลาเรียกทันที และตรวจสอบได้หลังจากโหลดหน้า]

ฉันได้ทำงานบนไซต์ SharePoint ของอินทราเน็ตสำหรับไคลเอนต์ซึ่ง, ในสิ่งอื่น ๆ, เป็นสุกใสรองนำตัวเลือกที่เมนูจัดการผ่านรายการที่กำหนดเองเก่าปกติ  ความคิดเป็นว่า ไคลเอนต์ได้รับการควบคุมเมนูของเว็บไซต์ "ของ" โดยไม่กระทบหรือรับผลกระทบจากการนำโลกดับโดย.

(มีทุกสิ่งอย่างเหลือเชื่อ subversive เกี่ยวกับการเพิ่ม CEWP ที่ชี้ไปยังแฟ้ม HTML ที่โหลด CSS และ JS บางพื้นฐานเปลี่ยนเกือบทุกอย่างเกี่ยวกับการทำงานของเว็บไซต์... แต่ที่ใช้สำหรับการลงรายการบัญชีอื่น)

รหัสสำหรับนี้ง่ายสวย:

  • รอหน้าเสร็จสิ้นการโหลด และทำต่างเวลาการเรียกโหลดรายการเมนูจากรายการโดยใช้ส่วนที่เหลือ หรือ lists.asmx หรืออะไรก็ตาม
  • ใช้ jQuery, ใส่พวงแบบไดนามิกหาก <li>ของภายในเป็นหลัก <ul> (ดูคริสเตียน Pinder บทที่นี่สำหรับคำอธิบายพี่ tecnnique นี้)
  • ใช้ CSS ในการทำทั้งหมดการจัดรูปแบบ
  • กำไร!

ที่นี่จุดเจ็บคือทุกครั้งที่คนฮิตหนึ่งหน้าของเว็บไซต์, เบราว์เซอร์ของผู้ใช้ได้ถึงจะได้รับสินค้าจากรายการ  เมื่อเดฟสมบูรณ์ และทดสอบ ได้พิสูจน์สิ่งที่มั่นคง และสมบูรณ์, สายนี้มีความจำเป็นมากกว่า 99% เวลาตั้งแต่เมนูไม่ค่อยเปลี่ยนแปลง  มีผล UI แปลกซึ่งมีทั่วไปในโลกใหม่นี้กล้าไฮเปอร์ ajaxy เว็บไซต์ – ทำหน้า และหลังจากนั้น ไม่เมนูแสดง  ภาพกระตุก และรบกวนในมุมมองของฉันได้  และภาพกระตุก. ดังนั้น, แค 

ฉันปรับเปลี่ยนแบบตรรกะ thusly:

  • หาคุกกี้ในเบราว์เซอร์ที่ประกอบด้วยเมนูล่าสุดอ่านว่า
    • ถ้าพบ, แสดงทันที  ไม่รอหน้าเสร็จสิ้นการโหลด  (คุณต้องแน่ใจว่าวาง HTML ของคุณเชิญที่นี่, แต่ไม่ยาก).
  • รอหน้าเสร็จสิ้นการโหลด และทำต่างเวลาการเรียกโหลดรายการเมนูจากรายการโดยใช้ส่วนที่เหลือ หรือ lists.asmx หรืออะไรก็ตาม
  • เปรียบเทียบสิ่งที่ผมมีกับใคร
    • ถ้ามันตรงกับ, หยุด
    • มิฉะนั้น, ใช้ jQuery, ใส่พวงแบบไดนามิกหาก <li>ของในตัว <ul>
  • ใช้ CSS ในการทำทั้งหมดการจัดรูปแบบ
  • กำไร!

บางท่านจะบอกว่า, "เฮ้! ไม่มีจะจริงแคที่นี่เนื่องจากคุณกำลังอ่านเมนูต่อไป ทีเดียว.”  และคุณขวา – ฉันกำลังไม่นำเซิร์ฟเวอร์ใด ๆ ที่ทำลาย  แต่เนื่องจากการโทรอยู่ต่างเวลา และเกิดขึ้นหลังจากหน้าของเริ่มต้น ส่วนของข้อมูลของ HTML เต็มสภาพ, "รู้สึก" มากกว่าตอบสนองต่อผู้ใช้  เมนูทำสวยมากวาดหน้า  ถ้าเมนูเกิดขึ้นกับการเปลี่ยนแปลง, ผู้ใช้จะต้องมีภาพกระตุกใหม่วาดของเมนู, แต่เท่าที่เวลาหนึ่ง.

มีบางวิธีจะทำให้การแคนี้มีประสิทธิภาพ และช่วยออกเซิร์ฟเวอร์ในเวลาเดียวกัน:

  • ใส่ในกฎที่ว่า "แคชคุกกี้" ถูกต้องอย่างน้อย 24 ชั่วโมงหรือเวลาอื่น ๆ. ตราบใดที่มีคุกกี้ไม่หมดอายุ, ใช้ snapshot ของเมนูของคุกกี้ และไม่เคยตีเซิร์ฟเวอร์.

ดี...ที่ทั้งหมดที่มาถึงใจขณะนี้ :). 

ถ้าใครมีความคิดฉลาดใด ๆ ที่นี่ ฉันจะรักรู้ว่าพวกเขา.

และสุดท้าย – สามารถใช้เทคนิคนี้สำหรับสิ่งอื่น ๆ  ไคลเอนต์นี้แล้วจำนวนข้อมูลขับเคลื่อนกิจกรรมต่าง ๆ หน้า, หลายของพวกเขาเปลี่ยนแปลงค่อนข้างบ่อย (เช่นสัปดาห์ละหนึ่งครั้งหรือเดือนละครั้ง).  ถ้าคุณกำหนดเป้าหมายพื้นที่เฉพาะของฟังก์ชัน, คุณสามารถให้ UI ที่ตอบสนองมากขึ้น โดยดึงเนื้อหาจากเก็บคุกกี้ในเครื่อง และแสดงผลทันที  มันรู้สึกเร็วต่อผู้ใช้แม้ว่าคุณกำลังไม่บันทึกเซิร์ฟเวอร์ใด ๆ รอบ  คุณ สามารถ บันทึกวงจรเซิร์ฟเวอร์ โดยการตัดสินใจในบางเงื่อนไขและทริกเกอร์จะทำให้แคภายในคุกกี้  นั่นคือในสถานการณ์ทั้งหมด และสิ่งที่แสนยาวนานและสนุกมากที่สุด :). 

</สิ้นสุด>

undefinedสมัครสมาชิกไปยังบล็อกของฉัน.

ทำตามฉันใน Twitter ที่ http://www.twitter.com/pagalvin

One thought on“คนดีของแคใน JavaScript

  1. Jonathan Roussel

    Hi Paul,

    ใช้งานดี, นั่นเป็นสิ่งที่เราใช้ แต่เราใช้ HTML5 เก็บภายใน API แทนคุกกี้. ไดรฟ์แรกเราต้องเก็บมากกว่าใช้คุกกี้. แต่ได้รับประโยชน์ว่า มันเพิ่ม payloads, ในขณะที่คุกกี้จะถูกส่งกลับมา. จากมุมมองของจุด dev จึงง่ายต่อการใช้.
    ไม่เหมาะรองแต่สุจริตอย่างดี, http://caniuse.com/namevalue-storage .

    โยนาธาน

ทิ้งคำตอบไว้

ที่อยู่อีเมลของคุณจะไม่ถูกเผยแพร่. ช่องที่ต้องการถูกทำเครื่องหมาย *