Internet Explorer'ın sonu

Internet Explorer desteğinin sonlandırılması, Maersk.com'daki müşteriler ve geliştiriciler için ne anlama geliyor?

steveworkman
steveworkman

Ben Steve Workman. Maersk.com'un Baş Mühendisi'yim. Maersk, entegre tedarik zinciri lojistiğinde dünya lideridir. Yirmi yılı aşkın süredir online rezervasyon hizmeti sunarak müşterilerin dünyanın dört bir yanında mal taşımalarına yardımcı olan Maersk, 118 yıldır bu alanda faaliyet gösteriyor. Microsoft'un Haziran 2022'de IE desteğini resmen sonlandırmasının ardından @Maersk, Mayıs 2022'nin başında müşterilere yönelik sistemlerinde Internet Explorer'ı (IE) resmi olarak desteklemeyi durdurdu. Bu, web'de önemli bir dönemin sonu ve yeni bir dönemin başlangıcıdır.

Maersk'e 2018 yılında katıldım ve ilk projem yeni bir küresel gezinme çubuğu oluşturmaktı. Tamamen test edilebilmesi, kesinti yaşamadan dünya genelinde dağıtılması ve güncellenmesi, mobil cihazlara öncelik vermesi, duyarlı olması, birden fazla markayı desteklemesi, yapılandırılabilir olması, 11 dile yerelleştirilmiş olması ve IE9'u desteklemesi gerekiyordu.

2018'de Windows 7 ve varsayılan tarayıcısı IE9 hâlâ çok popülerdi. Windows 10 ve IE11 ise yalnızca 2020'nin başlarında kritik kitleye ulaştı (İstatistik sayacına göre). Verilerimize baktığımızda, IE9 veya daha da kötüsü uyumluluk modunda IE11 kullanan müşterilerden önemli miktarda işlem geldiğini tespit ettik. Bu trafik, gelişmekte olan pazarlara ve Maersk'in müşteri tabanının hızla büyüdüğü bölgelere önemli ölçüde yönelmişti.

Gezinme menüsü çalışmıyorsa giriş düğmesinin bulunması zordur. Giriş işe yaramazsa kullanıcılar kapsayıcı rezervasyonu yapamaz ve eski tarayıcılardan kaynaklanan büyük bir sorunla karşı karşıya kalırsınız.

Bu sorunu çözmek için gezinme bileşeni ve gelecekteki tüm web uygulamalarıyla ilgili aşamalı bir iyileştirme yaklaşımı benimsedik. "İşe yarar" ancak bunu yapmak için önemli çoklu dolgular ve kısıtlamalar olabilir. Örneğin, IE Fetch API'sini desteklemez ancak bu tarayıcılar için eklediğimiz IE10'a geri giden çoklu dolgular vardır. IE9 için XMLHttpRequest çağrılarını, yalnızca fetch'nin poli doldurulamaması durumunda yüklenecek şekilde ayrı bir dosyada kodladık.

IE9 desteğini kesme zamanı geldiğinde, yalnızca sınırlı sayıda müşteri kaldığında, modern tarayıcılar kullanan kullanıcılarımıza en az çabayla ve maksimum avantaj sağlayarak bu kodu uygulamalarımızdan kolayca kaldırabildik.

Maersk'ın dijital dönüşümü devam ederken, sitenin birçok bölümünü VueJS ile desteklenen mikro kullanıcı arabirimleriyle yeniden oluşturduk. Vue, ileriye dönük bir yapıya sahipti. Gelişmiş ağaç sallama ve paket optimizasyonu için mükemmel bir hazır yapılandırma ve uygulamanın iki sürümünün oluşturulduğu bir modern mod (bunlardan biri, her zaman güncel olan tarayıcılar için en son ES modülü söz dizimini kullanan, diğeri ise ES6 modüllerini anlamayan eski uygulamalar için) gibi birçok özelliği vardı. Bu eski sürüm, IE gibi tarayıcılara sunulur ve sıkıştırılmış polyfill paketinde genellikle tarayıcının eksik özellikleri nedeniyle 100 KB daha büyüktür.

Microsoft'un spesifikasyonu IE10'da kullanıma sunması sayesinde CSS ızgara gibi modern CSS düzen tekniklerinin çoğunu da kullanabileceğimizi fark ettik. Bir sayfanın farklı alanlarını adlandırma konusunda gerçekten iyi olmamıza yardımcı olan autoprefixer ve bu CSS Tricks makalesi sayesinde hafif, her projeye uygun ve son derece esnek bir düzen sistemi elde ettik. Yine de düzeltilmesinin çok zaman aldığı uyumluluk sorunları vardı.

Aniden maliyet-yarar analizi aşamasına geri dönüyoruz, ancak bu sefer IE'nin herhangi bir sürümü için. IE9'da olduğu gibi, herkesi destekleme ve her proje için haftalarca süren zahmetli geliştirme süresi arasında bir denge kurmak gerekiyor. Modern bir tarayıcı kullanmanın müşterilerimiz için daha iyi bir deneyim sunacağından emin olarak, web sitesini ziyaret eden kullanıcılarımızı IE'den uzaklaştırdık. Bu değişikliğin, bizimle etkileşime geçmek için IE'yi açma alışkanlığı edinmiş olan etkin müşteriler için küçük miktarlarda başarılı olduğunu tespit ettik. Bu mesaj iyiydi ancak matematiksel olarak işe yaramadı.

IE'den gelen ziyaretler azaldıkça Maersk, kendilerinden önce birçok şirketin yaptığı gibi IE için resmi desteği sonlandırmaya karar verdi. Ancak rakamlar, IE'yi desteklemeye devam etmemiz gerektiğini gösteriyor. Peki neden şimdi?

Yatay gezinme çubuğu bulunan bir web sitesi.
Küresel gezinme bileşenini içeren Maersk ana sayfası.

Basitçe söylemek gerekirse, web platformu gelişti ve IE11, küçük bir polyfill ordusu olsa bile yapması gerekenleri yapamıyor. Gezinme bileşenini ele alalım. Modern bir web platformu dünyasında bu, kendi kapsüllenmiş stillerine sahip özel bir öğedir. CSS değişkenleri ve kapsayıcı sorguları tarafından yönlendirilir. Böylece her şeyi tek bir bileşende kontrol eder. Platformun bu parçaları olmadan, söz konusu bileşenlerin stili uygulamadan tamamen değiştirilebilir. Ayrıca stiller, diğer bileşenlere sızabilir veya uygulamaya geri dönebilir. Özel öğeler, ShadyCSS, ShadyDOM ve template öğesi dahil olmak üzere buradaki özelliklerin çoğunu taklit etmenize olanak tanıyan çoklu dolgular vardır.

Pratikte, bu çoklu dolgular izole bileşenler için çok kullanışlıdır. Ancak karmaşık bir uygulamada birden fazla bileşeni birleştirdiğinizde, IE onlarca saniyelik beyaz ekranla çalışmayı durdurur ve JavaScript çalışma zamanı kırk saniye için stil ağacını hesaplamaya çalışır. Kısacası, tarayıcı desteği için kullanıcı deneyiminden ciddi ölçüde ödün verilmişti.

Eskiden küçük kesintiler yaşandı. İlk boyamaya yarım saniye sürebilen çoklu dolgular fazlalık katmaz. Bu durum farklıydı ve bu uygulamalar kullanılamaz hale geldi. Modern web platformunun karmaşıklığıyla karşı karşıya kaldığında, polidoldurmaların yapabileceği çok fazla şey yoktur.

IE desteğini sonlandırdığımızdan beri neler oldu biliyor musunuz? Çok, çok az. Çok sayıda müşteri destek kaydı veya olumsuz geri bildirim gönderilmemiştir. Mühendislerimiz daha mutlu ve uygulamalarımız, Proxy nesnesi poli doldurulamaması nedeniyle IE11'i desteklemeyen Vue 3'e yükseltme yoluna ve daha küçük paket boyutlarına sahip. CSS değişkenleri ve değişken yazı tipleri için tam destek, markalar arasında daha basit temalar oluşturmanıza olanak tanır. Ayrıca, jetonları Vue'un tek dosya bileşenlerinde kullanabilmeniz, bilişsel karmaşıklığı azaltarak daha iyi bir geliştirici deneyimi sağlar.

Müşteri açısından IE kullanımı yavaş yavaş düşmeye devam etmektedir. IE, sitede devre dışı bırakılmadı ancak aşamalı iyileştirme, sorunsuz düşüşe dönüştüğünde özellikler ve uygulamalar çalışmayı durduracak. Müşteriler teknolojimizdeki gelişmelerden kazançlı çıkar. En iyi uygulamalar, erişilebilirlik ve tasarım, gelişen Lit tabanlı tasarım sistemine entegre edildiği için sitede daha tutarlı bir deneyim sağlanır. Bu sistem, mevcut veya gelecekteki tüm çerçevelerle tam birlikte çalışabilirlik sağlar.

Yeni web platformu özelliklerinin şirket içinde nasıl kullanılabileceğini görmekten heyecan duyuyorum. Gemi sistemlerinin geceleri daha kolay kullanılabilmesi için karanlık moddan, web uygulamalarımızın her koşulda çevremizdeki fiziksel dünyayla etkileşime geçebilmesi için Web Bluetooth, WebXR ve PWAs'a kadar birçok özellikten yararlanabiliriz. Internet Explorer, birçok şey için teşekkür ederiz. Artık web platformuna ayak uydurabiliriz.