อัพเดทการพัฒนาเว็บประจำเดือน 12⁄2017: Pragmatic Release, Custom Elements และ Making Decision

เผยแพร่แล้ว: 2022-03-10
สรุปอย่างย่อ ↬ เกิดอะไรขึ้นในชุมชนเว็บในช่วงสองสามสัปดาห์ที่ผ่านมา Anselm Hannemann สรุปทุกสิ่งที่ใหม่และสำคัญ เพื่อให้คุณไม่พลาดทุกสิ่ง

วันนี้ผมได้อ่านบทความที่น่าสนใจเกี่ยวกับคนรุ่นใหม่ในปัจจุบันและอนาคตทางการเงินของพวกเขา เป็นการยากที่จะเข้าใจคำศัพท์เช่น "Millenials" และมีการพูดคุยกันมากเกี่ยวกับปัญหาเฉพาะที่พวกเขาเผชิญ แต่สำหรับพวกเราหลายคน มันไม่ง่ายเลยที่จะเข้าใจการต่อสู้ของพวกเขา ไม่ว่าคุณจะแก่กว่าหรืออายุน้อยกว่าฉันก็ตาม (ฉันมีคุณสมบัติตาม คนรุ่นมิลเลนเนียล) แต่บทความที่ให้ความรู้และความบันเทิงของ Michael Hobbes ได้เปิดเผยสิ่งต่างๆ มากมายแก่ฉัน ไม่เพียงแต่ตอนนี้ฉันเข้าใจแล้ว และกระทั่งเกี่ยวข้องกับข้อเท็จจริงบางส่วนที่ระบุไว้เท่านั้น แต่ยังเป็นเพราะบทความนี้แสดงให้เห็นว่ากลุ่มอายุต่างๆ ก่อตัวขึ้นในสังคมอย่างไร โดยไม่ทราบถึง ผลกระทบที่การตัดสินใจของพวกเขาอาจมี ต่อชีวิตของผู้อื่น

ในฐานะผู้เชี่ยวชาญด้านเว็บ เราสามารถเชื่อมโยงกับสิ่งนั้นได้ในหลายแง่มุม เมื่อสร้างโครงการบนเว็บ เราทำการตัดสินใจและมักจะพิจารณาจากสิ่งที่ดีที่สุดสำหรับเรา ในฐานะนักพัฒนา ในฐานะผู้ประกอบการ ในฐานะนักยุทธศาสตร์การตลาด ในฐานะเจ้าหน้าที่ฝ่ายสนับสนุน โดยไม่ได้คิดว่าการตัดสินใจเหล่านี้จะส่งผลต่อผู้อื่นอย่างไร ด้วยการสร้างเว็บไซต์ที่ไม่สามารถเข้าถึงได้ เราคัดแยกผู้ใช้หลายล้านคน ด้วยการใช้เหตุการณ์และไลบรารีการวิเคราะห์ที่ดีขึ้น เราให้ข้อมูลของผู้ใช้ของเราแก่บุคคลที่สาม บางครั้งอาจดูเหมือนเป็นไปไม่ได้ที่จะตัดสินใจอย่างถูกต้อง และเรารู้สึกหนักใจกับความจริงที่ว่าเราไม่สามารถทำสิ่งที่ถูกต้องได้ จนละเลยการตัดสินใจที่สมเหตุสมผลทั้งหมด การตัดสินใจที่มีข้อมูลดีทั้งหมด และมุ่งเน้นเฉพาะสิ่งที่ดีที่สุดสำหรับ ตัวเราเอง. เราสามารถฉลาดขึ้นได้ และในขณะที่เราอาจ จะทำทุกอย่างไม่ถูกต้อง แต่เรายังสามารถทำตามขั้นตอนเล็กๆ แทนการจม ไม่ใช่เรื่องง่าย แต่อาจเป็นอะไรบางอย่างสำหรับปณิธานปีใหม่?

เพิ่มเติมหลังกระโดด! อ่านต่อด้านล่าง↓

ข่าว

  • ข่าวใหญ่เกี่ยวกับ WHATWG: องค์กรที่อยู่เบื้องหลังกลไกเบราว์เซอร์หลักสี่ตัว ได้แก่ Apple, Google, Microsoft และ Mozilla ได้พัฒนานโยบายสิทธิในทรัพย์สินทางปัญญา (IPR) และโครงสร้างการกำกับดูแลสำหรับ WHATWG หวังว่าจะส่งผลให้มาตรฐานการครองชีพดีขึ้นซึ่งเป็นทรัพยากรที่มีประโยชน์มากขึ้น
  • เปิดตัวไปจริงแล้วในเดือนพฤศจิกายน นี่คือสิ่งที่ใหม่ใน Firefox 57 ตอนนี้มาพร้อมกับเครื่องยนต์ Quantum ที่เร็วสุด ๆ ส่วนขยายของเว็บก็กลายเป็นความจริงเช่นกัน และคาดว่าจะสามารถแก้ไขข้อผิดพลาดอื่นๆ อีกมากสำหรับปัญหาเก่าและการปรับปรุงประสิทธิภาพได้ในอนาคต แล้วนักพัฒนาของเราล่ะ? Firefox 57 รองรับ <input type="\\[date|time]"> บั๊ก CSS จำนวนมากได้รับการแก้ไขแล้วด้วยเอ็นจิ้นใหม่ และตอนนี้ Performance Observer API เปิดใช้งานแล้ว เช่นเดียวกับ Storage API และ Abort API (เช่น สำหรับคำขอดึงข้อมูล) สุดท้ายแต่ไม่ท้ายสุด โหมดหัวขาดตอนนี้สนับสนุน --screenshot flag ที่มีประโยชน์อย่างเหลือเชื่อ อย่างไรก็ตาม Quantum engine กำลังจะมาใน Firefox บน Android 59 ในไม่ช้าเช่นกัน
  • Chrome 63 ออกมาพร้อมกับคุณสมบัติใหม่ที่ยอดเยี่ยม: โมดูล JavaScript แบบไดนามิก, ตัววนซ้ำและตัวสร้าง async , overscroll-behavior CSS (ซึ่งรองรับการดึงเพื่อรีเฟรช) และรองรับ Intl.PluralRules API เป็นต้น นอกจากนี้ UI การอนุญาตจะขออนุญาตในรูปแบบโมดอลเพื่อให้ชัดเจนว่าเจ้าของไซต์ควรขอการอนุญาตเพิ่มเติมเมื่อจำเป็นและมีประโยชน์เท่านั้น Intl.PluralRules API รวมอยู่ในเวอร์ชันนี้ด้วย

ทั่วไป

  • อเมซอนเป็นที่น่าอัศจรรย์ใช่มั้ย? คลาวด์ของพวกเขานั้นรวดเร็ว ใหญ่ และราคาถูก ร้านค้าของพวกเขามีทุกอย่างและจัดส่งได้อย่างรวดเร็ว ในสัปดาห์นี้ Amazon Web Services ได้ประกาศสิ่งที่น่าสนใจมาก: “ตอนนี้ AWS ให้ US Intelligence Community มีความสามารถระบบคลาวด์เชิงพาณิชย์ในทุกระดับการจัดหมวดหมู่: Unclassified, Sensitive, Secret และ Top Secret” ใช่ คุณอ่านถูกต้องแล้ว: ดูเหมือนว่า Amazon จะเป็นบริษัทที่รับผิดชอบในการโฮสต์ข้อมูลลับสุดยอดของบริการ US Intelligence ฉันค่อนข้างแน่ใจว่าไม่ใช่ความคิดที่ดีที่บริการของรัฐบาลเริ่มพึ่งพาบริการคลาวด์เฉพาะของบริษัทอย่างเต็มที่ โดยไม่มีตัวเลือกให้เปลี่ยนกลับไปเป็นคู่แข่งหรือทางเลือกอื่นได้อย่างง่ายดาย ให้สัมพันธ์กับสิ่งที่ Amazon เป็น: ทราฟฟิกอินเทอร์เน็ตมากถึง 70% ผ่านศูนย์ข้อมูล AWS Virginia, Amazon ต้องการกล้องและไมโครโฟนในห้องนอนของคุณ ห้องนั่งเล่น และกุญแจอัจฉริยะสำหรับแฟลตหรือบ้านของคุณ และ เป็นไปไม่ได้อยู่แล้วที่จะไม่ใช้ AWS หากคุณใช้อินเทอร์เน็ต จะเกิดอะไรขึ้นกับชุมชนข่าวกรองของสหรัฐฯ หากระบบคลาวด์ที่ปลอดภัยของ AWS นี้ได้รับผลกระทบจากการหยุดทำงานเหมือนที่เกิดขึ้นในปีนี้ พวกเขาจะยังสามารถดำเนินการได้หรือไม่? จะเกิดอะไรขึ้นหากเกิดขึ้นระหว่างการสอบสวนเชิงรุก?

เครื่องมือช่าง

  • พวกเราคนไหนที่ไม่รู้จักความท้าทายที่ยิ่งใหญ่ของการเปิดตัวและต้องใช้เวลานานแค่ไหน ตอนนี้ Raymond Rutjes แนะนำว่าการปล่อยตัวควรจะเป็นไปได้สำหรับทุกคนในทีม ควรเป็นเรื่องง่าย ไร้กังวล และที่สำคัญที่สุดคือรวดเร็ว
  • Francesco Schwarz ได้สร้างเครื่องมือใหม่เพื่อแสดงภาพความจำเพาะของ CSS ของคุณ มีประโยชน์มากในการวิเคราะห์ความเข้าใจผิดบางอย่างในโครงสร้างของคุณหรือเพื่อระบุโมดูลที่ควรได้รับการปรับโครงสร้างใหม่
การปล่อยตัวในทางปฏิบัติ
กังวลน้อยลง จัดส่งมากขึ้น นั่นเป็นการปล่อยในทางปฏิบัติ (ที่มาของภาพ)

UI/UX

  • ด้วย Spectral จะมีแบบอักษร serif ตัวแรกสำหรับหน้าจอใหม่ภายใต้ลิขสิทธิ์โอเพนซอร์ส
  • John Moore Williams แชร์แนวทางปฏิบัติที่ดีที่สุดสำหรับการออกแบบการค้นหาไซต์ เคล็ดลับสำคัญหากคุณต้องการมอบประสบการณ์การค้นหาที่มีประสิทธิภาพและทรงพลังแก่ผู้ใช้

ประสิทธิภาพของเว็บ

  • Michael Scharnagl อธิบายวิธีที่เราสามารถใช้ Service Workers (ซึ่งโดยพื้นฐานแล้วคือเว็บพรอกซี) เพื่อโหลดรูปภาพตาม Network Information API
  • แฮร์รี่ โรเบิร์ตส์มักพบคำที่เหมาะสมในการเปิดเผยปัญหาที่คนจำนวนมากไม่เข้าใจ บทความของเขาเรื่อง “The Fallacies of Distributed Computing (Applied to Front-End Performance)” เป็นเรื่องเกี่ยวกับการสร้างสมมติฐานสำหรับผู้ใช้และการเพิกเฉยหรือคิดมากเกี่ยวกับปัญหา เช่น ประสิทธิภาพของเครือข่าย
  • “คำขอที่ดีที่สุดไม่ใช่คำขอ ทบทวน” เป็นบทความใหม่โดย Stefan Baumgartner ที่อธิบายสิ่งที่คุณสามารถทำได้ด้วย HTTP/2 ในตอนนี้ และการเปลี่ยนแปลงที่ทำงานในทางทฤษฎีแต่ยังใช้งานไม่ได้จริง
  • ซามูเอล พาร์กินสันอธิบายว่าจะเกิดอะไรขึ้นเมื่อคุณไปที่ ft.com ข้อมูลเชิงลึกที่เริ่มต้นด้วย DNS และดำเนินการตามขั้นตอนการทำงานคำขอที่สมบูรณ์ของ Financial Times
Financial Times Stack
สแต็ค ft.com แบบง่าย สำหรับข้อมูลเชิงลึกเพิ่มเติม อย่าลืมอ่านบทความของ Sam Parkinson (ที่มาของภาพ)

ความปลอดภัย

  • 4iQ บริษัทปกป้องข้อมูลระบุตัวตน พบฐานข้อมูลรั่วไหลซึ่งมีข้อมูลรับรองข้อความที่ชัดเจน 1.4 พันล้านรายการใน Dark Web อาจเป็นแหล่งข้อมูลที่ใหญ่ที่สุดที่รู้จัก และแสดงให้เห็นอีกครั้งว่าการใช้รหัสผ่านที่ไม่ซ้ำกันสำหรับแต่ละบริการมีความสำคัญเพียงใด
  • HSTS เป็นวิธีที่บอกให้เบราว์เซอร์เชื่อมต่อกับชื่อโฮสต์บางชื่อผ่านโปรโตคอล HTTPS ที่ปลอดภัยเท่านั้น อย่างไรก็ตาม วิธีที่ใช้ในเบราว์เซอร์ในปัจจุบันค่อนข้างใช้งานไม่ได้และเสี่ยงต่อการถูกโจมตี ดังที่การวิจัยแสดงให้เห็นอย่างเด่นชัด
  • Tobias Tom แชร์วิธีที่ Colloq ใช้การตรวจสอบรหัสผ่านที่ป้องกันไม่ให้ผู้ใช้เลือกรหัสผ่านที่ถูกเปิดเผยในการละเมิดข้อมูลสาธารณะ อิงตามชุดข้อมูลที่น่าทึ่งโดย Troy Hunt และแชร์ข้อมูลที่น่าสนใจเกี่ยวกับวิธีการตรวจสอบกับชุดข้อมูล Postgres ขนาด 40GB โดยไม่ส่งผลต่อประสิทธิภาพของไซต์ของคุณ
  • คุณคงเคยได้ยินเกี่ยวกับการขุด crypto ในเบราว์เซอร์แล้ว สคริปต์ที่ค้นพบใหม่จะตรวจสอบการสนับสนุน WebAssembly เพื่อใช้ประโยชน์จากความสามารถของฮาร์ดแวร์อย่างเต็มที่ จากนั้นจึงเปิดหน้าต่างป๊อปอันเดอร์ที่ขุดสกุลเงินดิจิทัลในเบื้องหลัง การบรรเทาผลกระทบเพียงอย่างเดียวคือการบังคับปิดกระบวนการงานทั้งหมดของเบราว์เซอร์ด้วยตนเอง อย่างไรก็ตาม ยังมีส่วนขยายเบราว์เซอร์บางตัวที่สามารถบล็อกสคริปต์การขุดทั่วไปได้โดยตรง

การช่วยสำหรับการเข้าถึง

  • วิธีที่ดีที่สุดในการออกแบบและเข้ารหัสตารางที่เหมาะกับทุกคนคืออะไร Adrian Roselli แชร์วิธีสร้างตารางที่ตอบสนองและเข้าถึงได้
  • นี่คือ Marcy Sutton ที่ให้ความสำคัญกับการเขียนการทดสอบอัตโนมัติสำหรับการช่วยสำหรับการเข้าถึง และเหตุใดการทำเช่นนั้นไม่ได้หมายความว่าเราไม่ต้องทำงานการช่วยสำหรับการเข้าถึงด้วยตนเองอีกต่อไป

CSS

  • Jonathan Snook อธิบายวิธีที่เราสามารถสร้างเค้าโครงปฏิทินด้วย CSS Grid
  • ด้วยข้อกำหนด CSS Selectors ระดับ 4 ที่กำลังจะมาถึง เราจะได้รับ :is pseudo selector ที่คล้ายกับ :matches แต่ไม่เพิ่มความเฉพาะเจาะจง

JavaScript

  • Brian Kardell เขียนโพสต์สำคัญเกี่ยวกับวิธีที่เราจะใช้ Custom Elements เป็นส่วนขยายขององค์ประกอบพื้นฐานทั่วไปในเร็วๆ นี้ สิ่งนี้ยอดเยี่ยมเป็นพิเศษ เนื่องจากเราไม่จำเป็นต้องสร้างทุกอย่างตั้งแต่เริ่มต้น แต่จะสามารถขยายองค์ประกอบดั้งเดิมด้วยการปรับแต่งเองได้ ในขณะที่ยังคงสืบทอดความสามารถในการเข้าถึงและการใช้งานทั้งหมดจากองค์ประกอบดั้งเดิม นอกจากนั้น คุณลักษณะนี้ยังช่วยให้สร้างองค์ประกอบที่กำหนดเองที่ได้รับการปรับปรุงให้ดีขึ้นเรื่อยๆ
  • บรรลุการสืบค้นคอนเทนเนอร์ด้วยเครื่องมือที่ทันสมัยใน JavaScript หรือไม่ Ali Alaa แชร์วิธีที่เราทำได้ด้วย MutationObserver
  • Safari รองรับ import() JavaScript แบบไดนามิกในรุ่นตัวอย่างแล้ว และ Chrome 63 จะรองรับด้วยเช่นกัน Mathias Bynens อธิบายว่าสิ่งนี้หมายถึงอะไรและเราจะใช้มันได้อย่างไร import() เป็น import โดยพื้นฐานและให้คุณโหลดโมดูล JavaScript ทั้งหมดได้ทันทีเมื่อคุณต้องการจริงๆ เท่านั้น
  • Jake Archibald อธิบายความแตกต่างที่ลึกซึ้งแต่สำคัญระหว่าง await , return , และ return await และให้คำแนะนำว่าควรใช้เมื่อใด
แบบสอบถามสื่อด้วย MutationObserver
หากคุณเคยต้องการให้การสืบค้นสื่ออิงตามความกว้างขององค์ประกอบมากกว่าวิวพอร์ตทั้งหมด วิธีแก้ปัญหาของ Ali Alaa นั้นเหมาะสำหรับคุณ (ที่มาของภาพ)

ชีวิตการทำงาน

  • “มีช่วงหนึ่งที่คุณสามารถเขียนบทกวีสองสามเรื่อง เสียชีวิตด้วยวัณโรค และเรียกมันว่าชีวิตที่ดี” Quinn Norton ตีพิมพ์แนวคิดเรื่อง "Against Productivity" และเกี่ยวกับความพยายามที่แปลกประหลาดในตัวเราทุกคนเพื่อเพิ่มผลผลิตในชีวิต
  • เจมส์ เคลียร์อธิบายว่าเหตุใดชีวิตจึงดูซับซ้อนขึ้นอยู่เสมอ และสิ่งที่เราสามารถทำได้เพื่อไม่ให้รู้สึกว่าถูกครอบงำ
  • ตามรายงานของ The Guardian นายจ้างจำนวนมากกำลังใช้เทคโนโลยีที่หลากหลายเพื่อติดตามรูปแบบการท่องเว็บ การกดแป้นพิมพ์ โพสต์บนโซเชียลมีเดีย และแม้แต่แอพส่งข้อความส่วนตัวของพนักงาน เป็นการเฝ้าระวังการทำงานที่แสดงความไม่ไว้วางใจอย่างยิ่งของบริษัทต่อพนักงาน แต่จะทำอย่างไรถ้านายจ้างของคุณทำเช่นเดียวกัน? วิธีที่ดีที่สุดคือการพูดคุยกับเจ้านายของคุณว่าคุณคิดว่าพวกเขาไม่เห็นคุณค่างานของคุณ และรู้สึกว่าพวกเขาไม่ไว้ใจคุณหากพวกเขาเฝ้าติดตามคุณ
  • Ryan Singer แชร์ว่าทำไมการทำ Agile ถึงไม่ได้ผล ปัญหาอยู่ที่การทำสิ่งผิด การสร้างข้อกำหนด และการฟุ้งซ่าน การค้นหาสิ่งที่ถูกต้องในการทำงาน การทำอย่างระมัดระวังและวนรอบเป็นการทำงานที่คล่องตัวอย่างแท้จริง อย่าฟุ้งซ่านกับตัวเลขและคำศัพท์ และให้เน้นสิ่งที่สำคัญแทน
  • Alida Miranda-Wolff พูดถึงประเด็นที่ว่าเหตุใด "การเคลื่อนไหวอย่างรวดเร็วและทำลายสิ่งต่างๆ" จึงเป็นความคิดที่ไม่ดีเมื่อพูดถึงผู้คนเพราะ "สิ่ง" ที่แตกสลายคือบุคคล ประเด็นเรื่องชั่วโมงทำงาน ความสุขในการทำงาน การเพิ่มพูนความสามารถ และเหตุผลที่อยากทำตามแบบแผนทำร้ายร่างกาย
  • Dan Kim แบ่งปันสาเหตุที่เขาคิดว่าถึงเวลาแล้วที่การประชุมที่เกิดซ้ำจะสิ้นสุดลงเพื่อทำงานร่วมกันในลักษณะที่ไม่เสียเวลา แต่เน้นสิ่งที่สำคัญที่ต้องพูดคุย ข้ออ้างให้คิดอย่างมีเหตุผลเกี่ยวกับการประชุมที่เกิดซ้ำ
วิ่งเป็นวงกลม
งานที่ต้องใช้การแก้ปัญหาก็เหมือนเนินเขา Ryan Singer อธิบายว่าทำไม Agile ถึงไม่ทำงานในกรณีนั้น (ที่มาของภาพ)

ก้าวไกล…

  • สกอตต์ เบอร์คุนอธิบายว่าทำไมการเปลี่ยนแปลงที่ถูกต้องจึงมักจะรู้สึกผิด หากคุณสามารถเชื่อมโยงกับมันได้ ฉันแนะนำให้อ่านบทความนี้เพราะจะช่วยให้คุณเข้าใจว่าทำไมเราถึงรู้สึกแบบนั้นและทำไมสิ่งนี้ถึงเป็นเรื่องธรรมชาติ
  • ผู้อยู่เบื้องหลังซีรี่ส์ Do Lectures ที่ยอดเยี่ยมได้แบ่งปันหนังสือ 100 เล่มในปี 2017 พวกเขาแนะนำให้เราอ่าน และถึงแม้ฉันจะอ่านหนังสือได้ไม่ครบร้อยเล่ม แต่ก็มีเคล็ดลับดีๆ บางอย่างในรายการซึ่งถือว่าเป็นหนังสือที่น่าอ่านส่งท้ายปี
  • ในช่วงหลายเดือนที่ผ่านมา ฉันได้อ่านบทความจากคนที่ทำงานหรือเคยทำงานให้กับบริษัทโซเชียลมีเดียมากขึ้นเรื่อยๆ และตอนนี้ก็พูดถึงว่าบริการดังกล่าวมีส่วนอย่างมากในการทำลายสังคมของเราอย่างไร นี่เป็นอีกปัญหาหนึ่งที่แสดงปัญหาของข้อมูลที่ผิด "ไทม์ไลน์" แบบรวมที่ได้รับอิทธิพลจาก AI ซึ่งทำให้สิ่งต่างๆ แย่ลงแทนที่จะรวมสังคมและช่วยเหลือผู้คน แม้ว่าโซเชียลมีเดียจะมีคุณค่ามากมาย แต่ก็มีปัญหาแฝงอยู่ในบริการขนาดใหญ่ส่วนใหญ่: ในการพยายามหารายได้และคุณสมบัติใหม่ ๆ บริการเหล่านี้พยายามจับคู่ความสนใจกับผู้คนและล้มเหลวอย่างน่ากลัวเพราะตรงกับความสนใจค่อนข้างดีแทนที่จะให้ตา- เนื้อหาที่เปิดกว้าง เป็นกลาง และเป็นกลางสำหรับผู้ใช้ที่จะทำให้พวกเขาสะท้อนมุมมองและความสนใจของพวกเขา

เราหวังว่าคุณจะสนุกกับการอัปเดตการพัฒนาเว็บนี้ ครั้งต่อไปมีกำหนดวันที่ 19 มกราคม คอยติดตาม!