การสนับสนุนสำหรับ Internet Explorer มีความหมายอย่างไรต่อลูกค้าและนักพัฒนาซอฟต์แวร์ที่ Maersk.com
ผมชื่อ Steve Workman เป็นหัวหน้าวิศวกรของ Maersk.com และเป็น Maersk เป็นผู้นำระดับโลกในด้านโลจิสติกส์ด้านซัพพลายเชนแบบผสานรวม ซึ่งช่วยให้ลูกค้าขนย้ายสินค้าไปทั่วโลกเป็นเวลา 118 ปี ด้วยการจองผ่านระบบออนไลน์มานานกว่า 20 ปี เมื่อต้นเดือนพฤษภาคม 2022 @Maersk ได้หยุดรองรับ Internet Explorer (IE) ในระบบที่รองรับลูกค้าอย่างเป็นทางการ หลัง Microsoft ยุติการรองรับ IE อย่างเป็นทางการในเดือนมิถุนายน 2022 นี่คือจุดจบของยุคสำคัญของเว็บ และเป็นการเริ่มต้นยุคใหม่
ผมร่วมงานกับ Maersk ในปี 2018 และโครงการแรกของผมคือการสร้างแถบนำทางใหม่ทั่วโลก อุปกรณ์จะต้องสามารถทดสอบได้อย่างสมบูรณ์ นำไปติดตั้งใช้งานได้ง่าย และอัปเดตทั่วโลกโดยไม่มีช่วงพัก ให้ความสำคัญกับอุปกรณ์เคลื่อนที่เป็นอันดับแรก การตอบสนองอย่างรวดเร็ว รองรับหลายแบรนด์ กำหนดค่าได้ ได้รับการแปลเป็นภาษาต่างๆ 11 ภาษา... และรองรับ IE9
ในปี 2018 นั้น Windows 7 และเบราว์เซอร์เริ่มต้น IE9 ยังคงได้รับความนิยมสูงอยู่ โดย Windows 10 และ IE11 มีจำนวนถึงขั้นวิกฤตในช่วงต้นปี 2020 เท่านั้น (จากข้อมูลสถิติ) เมื่อดูข้อมูลของเรา เราพบว่ามีการซื้อขายเป็นจำนวนมากจากลูกค้าที่ใช้ IE9 หรือที่แย่กว่านั้นคือ IE11 ในโหมดความเข้ากันได้ การเข้าชมลักษณะนี้มีแนวโน้มที่จะคดเคี้ยวไปยังตลาดเกิดใหม่อย่างมาก และอยู่ในพื้นที่ที่ฐานลูกค้าของ Maersk เติบโตอย่างรวดเร็ว
หากเมนูการนำทางไม่ทำงาน แสดงว่าหาปุ่มเข้าสู่ระบบได้ยาก หากการเข้าสู่ระบบใช้งานไม่ได้ แสดงว่าเว็บไซต์เหล่านั้นไม่สามารถจองคอนเทนเนอร์ และจู่ๆ ก็พบปัญหาใหญ่ซึ่งเกิดจากเบราว์เซอร์รุ่นเก่า
ในการแก้ปัญหานี้ เราได้ใช้จุดยืนในการเพิ่มประสิทธิภาพแบบก้าวหน้ากับคอมโพเนนต์การนำทางและเว็บแอปในอนาคตทั้งหมด เราจะทำให้เป็น "ใช้งานได้" แต่อาจมี Polyfill และข้อจำกัดต่างๆ ที่สำคัญในการดำเนินการดังกล่าว ตัวอย่างเช่น IE ไม่รองรับการดึงข้อมูล API แต่มี Polyfill ที่กลับไปที่ IE10 ที่เรารวมเอาไว้สำหรับเบราว์เซอร์เหล่านั้น สำหรับ IE9 เราเขียนโค้ดการเรียกใช้ XMLHttpRequest ในไฟล์แยกต่างหากเพื่อให้โหลดได้เฉพาะในกรณีที่ไม่สามารถสร้าง Polyfill ของ fetch ได้
เมื่อถึงเวลาที่ต้องหยุดรองรับ IE9 แล้ว แต่มีลูกค้าเพียงบางราย เราก็สามารถทิ้งโค้ดนี้จากแอปพลิเคชันของเราได้ง่ายๆ โดยไม่ต้องลงแรงมากและได้ประโยชน์มากที่สุดสำหรับผู้ใช้ของเราบนเบราว์เซอร์ที่ทันสมัย
เมื่อการเปลี่ยนแปลงทางดิจิทัลของ Maersk ยังคงดำเนินต่อไป เราได้สร้างหลายส่วนของเว็บไซต์ขึ้นใหม่ในส่วนหน้าแบบไมโครที่ขับเคลื่อนด้วย VueJS Vue มีฟีเจอร์มากมายที่ทำให้เป็นมิตรต่ออนาคตด้วยการกำหนดค่าที่กำหนดล่วงหน้าที่ยอดเยี่ยมสำหรับการเขย่าต้นไม้ขั้นสูงและการเพิ่มประสิทธิภาพแพ็กเกจ ไปจนถึงโหมดสมัยใหม่ที่มีการสร้างแอป 2 เวอร์ชัน โดยเวอร์ชันหนึ่งใช้ไวยากรณ์โมดูล ES เวอร์ชันล่าสุดสำหรับเบราว์เซอร์ที่ใช้ได้ตลอด และอีกเวอร์ชันสำหรับแอปพลิเคชันเดิมที่ไม่เข้าใจโมดูล ES6 เวอร์ชันเดิมนี้จะให้บริการในเบราว์เซอร์ต่างๆ เช่น IE และมักจะใหญ่กว่า 100 KB ในกลุ่ม Polyfill ที่บีบอัดด้วย gzip เพียงจากจำนวนฟีเจอร์ที่เบราว์เซอร์หายไป
เราพบว่าเราสามารถใช้เทคนิคการออกแบบ CSS สมัยใหม่ส่วนใหญ่ เช่น ตารางกริด CSS ได้ด้วย เนื่องจาก Microsoft ได้เริ่มข้อกำหนดทางเทคนิคเดิมใน IE10 ตัวนำหน้าอัตโนมัติและบทความเกี่ยวกับเคล็ดลับ CSS นี้ช่วยให้เราตั้งชื่อพื้นที่ต่างๆ ของหน้าเว็บได้เป็นอย่างดี เราจึงมีระบบเลย์เอาต์ที่น้ำหนักเบา เหมาะกับทุกโปรเจ็กต์ และมีความยืดหยุ่นอย่างมาก แต่ก็ยังมีปัญหาด้านความเข้ากันได้ที่ต้องใช้เวลานานในการแก้ไข
จู่ๆ เราก็กลับมาอยู่ในขั้นตอนการวิเคราะห์ต้นทุนและผลประโยชน์ แต่สำหรับ IE เวอร์ชันใดก็ตามในตอนนี้ และก็เหมือนกับ IE9 คือจะต้องแลกระหว่างการสนับสนุนทุกคนกับเวลาหลายสัปดาห์ที่ทุ่มเทให้กับโปรเจ็กต์แต่ละโปรเจ็กต์ เรามั่นใจว่าการใช้เบราว์เซอร์ที่ทันสมัยจะช่วยให้ลูกค้าของเราได้รับประสบการณ์ที่ดีกว่า เราจึงกระตุ้นให้ผู้ใช้ออกจาก IE เมื่อเข้าชมเว็บไซต์ ซึ่งเราพบว่าวิธีนี้ประสบความสำเร็จในจำนวนไม่มากสำหรับลูกค้าที่ใช้งานอยู่ ซึ่งเปิดรับ IE เป็นนิสัยเมื่อโต้ตอบกับเรา ข้อความนี้ดี แต่ก็ยังไม่เพียงพอที่จะใช้คณิตศาสตร์
เมื่อการเข้าชมจาก IE ห่างหายไป Maersk ตัดสินใจตามผู้นำรายอื่นๆ อีกหลายคนก่อนและยุติการสนับสนุนอย่างเป็นทางการของ IE แม้ว่าตัวเลขต่างๆ จะบอกว่าเราควรสนับสนุน ทำไมต้องเป็นตอนนี้
พูดง่ายๆ ก็คือ แพลตฟอร์มเว็บได้ย้ายไปแล้ว และ IE11 ก็ไม่สามารถทำในสิ่งที่เราต้องการได้ แม้ว่าจะมีโพลีฟิลล์เล็กๆ น้อยๆ ก็ตาม มาใช้คอมโพเนนต์การนำทางในโลกของแพลตฟอร์มเว็บสมัยใหม่ องค์ประกอบนี้จะเป็นองค์ประกอบที่กำหนดเอง โดยมีสไตล์ที่ห่อหุ้มไว้เอง ขับเคลื่อนโดยตัวแปร CSS และคำค้นหาคอนเทนเนอร์เพื่อให้ควบคุมทุกอย่างได้ในคอมโพเนนต์เดียว หากไม่มีแพลตฟอร์มเหล่านี้ รูปแบบของคอมโพเนนต์เหล่านี้สามารถเปลี่ยนแปลงจากแอปพลิเคชันได้โดยสิ้นเชิง และรูปแบบอาจรั่วไหลไปยังคอมโพเนนต์อื่นๆ หรือกลับไปที่แอปพลิเคชันได้ มี Polyfill ที่จะช่วยให้คุณจำลองฟีเจอร์ส่วนใหญ่ได้ที่นี่ รวมถึงองค์ประกอบที่กำหนดเอง, ShadyCSS, ShadyDOM และองค์ประกอบเทมเพลต
ในทางปฏิบัติแล้ว โพลีฟิลเหล่านี้ทำงานได้ดีสำหรับคอมโพเนนต์ที่แยกออกมาต่างหาก แต่เมื่อรวมคอมโพเนนต์หลายคอมโพเนนต์ในแอปพลิเคชันที่ซับซ้อน IE จะหยุดชะงักโดยมีหน้าจอสีขาวหลายสิบวินาทีขณะที่รันไทม์ของ JavaScript พยายามคำนวณแผนผังรูปแบบเป็นเวลา 40 วินาที กล่าวโดยสรุปคือ ประสบการณ์ของผู้ใช้ถูกบุกรุกอย่างมากเพื่อรองรับเบราว์เซอร์
ก่อนหน้านี้เรามีการหยุดชะงักเล็กๆ น้อยๆ ซึ่งก็คือโพลีฟิลที่อาจเพิ่มขึ้นครึ่งวินาทีในการวาดครั้งแรก แต่ไม่ได้ใช้เวลามากกว่านี้มาก ซึ่งแตกต่างจากเดิม และแอปเหล่านี้ไม่สามารถใช้งานได้ Polyfill สามารถทำสิ่งต่างๆ ได้มากมายเฉพาะเมื่อเผชิญกับความซับซ้อนของแพลตฟอร์มเว็บสมัยใหม่
และรู้ไหมว่าเกิดอะไรขึ้นตั้งแต่เราเลิกรองรับ IE น้อยมาก ไม่มีคำขอแจ้งปัญหาหรือคำขอลบของฝ่ายสนับสนุนลูกค้าจำนวนมหาศาล วิศวกรของเราพอใจมากขึ้น และแอปพลิเคชันของเรามีเส้นทางการอัปเกรดไปยัง Vue 3 (ซึ่งไม่รองรับ IE11 เนื่องจากออบเจ็กต์พร็อกซีไม่สามารถเปลี่ยนแปลงได้) และ Bundle ขนาดเล็ก การรองรับตัวแปร CSS และแบบอักษรที่เปลี่ยนแปลงได้อย่างเต็มรูปแบบช่วยให้แยกธีมแบรนด์ต่างๆ ได้ง่ายขึ้น และความสามารถในการใช้โทเค็นในคอมโพเนนต์ไฟล์เดียวของ Vue ยังช่วยลดความซับซ้อนทางความคิดและสร้างประสบการณ์การใช้งานที่ดียิ่งขึ้นให้แก่นักพัฒนาซอฟต์แวร์
จากมุมมองของลูกค้า การใช้งาน IE ยังคงลดลงอย่างช้าๆ IE ไม่ได้ถูกปิดการทำงานจากเว็บไซต์ แต่เมื่อการปรับปรุงแบบก้าวหน้ากลายมาเป็นประสิทธิภาพการทำงานที่ลดลงอย่างค่อยเป็นค่อยไป ฟีเจอร์และแอปพลิเคชันต่างๆ ก็จะหยุดทำงาน ลูกค้าจะได้รับประโยชน์จากความก้าวหน้าทางเทคโนโลยีของเรา กล่าวคือ ได้รับประสบการณ์ที่สม่ำเสมอมากขึ้นจากเว็บไซต์เนื่องจากแนวทางปฏิบัติแนะนำ การช่วยเหลือพิเศษ และการออกแบบได้รับการผสานเข้ากับระบบการออกแบบที่ใช้ Lit ซึ่งมีการเปลี่ยนแปลงอยู่ตลอดเวลา พร้อมกับความสามารถในการทำงานร่วมกันอย่างเต็มรูปแบบกับเฟรมเวิร์กทั้งหมดที่มีอยู่ในปัจจุบันหรือในอนาคต
ผมตื่นเต้นมากที่จะได้เห็นวิธีใช้ฟีเจอร์ใหม่ของแพลตฟอร์มเว็บภายในบริษัท ตั้งแต่การใช้โหมดมืดเพื่อให้ใช้งานระบบเรือในตอนกลางคืนได้ง่ายขึ้น ไปจนถึงเว็บบลูทูธ, WebXR และ PWA เพื่อให้เว็บแอปของเราโต้ตอบกับโลกจริงรอบตัวเราได้ในทุกสภาวะต่างๆ ขอบคุณ Internet Explorer สำหรับสิ่งต่างๆ มากมาย ตอนนี้เราสามารถตามแพลตฟอร์มเว็บได้อย่างอิสระ
รูปภาพหลักโดย Matt Botsford