Aylık Web Geliştirme Güncellemesi 6⁄2018: Karmaşıklık, HTTPS Üzerinden DNS ve Anında Bildirimler

Yayınlanan: 2022-03-10

Kısa özet ↬ Anselm Hannemann, yeni olan her şeyi kolayca yakalayabilmeniz için son dört hafta içinde web geliştirme dünyasında meydana gelen en önemli şeyleri özetledi.

Bugünlerde bir web projesinin her köşesinde karmaşıklık görüyoruz. Belirli bir teknolojinin ne kadar karmaşık hale geldiği hakkında bir sürü makale okuduk ve bunu tekrar tekrar tartışıyoruz. Web sitelerini FTP aracılığıyla yüklediğimiz ve git veya karşılaştırılabilir bir şeye sahip olmadığımız bir zamandan geliyor, şimdi bir yapı sistemimiz, aktarıcılarımız, çerçevelerimiz, testlerimiz ve en küçük projeler için bile bir CI'ye sahip olduğumuz bir zamanda yaşıyoruz, bunu anlamak kolaydır. . Ancak diğer yandan, web geliştirme son 15 yılda o kadar büyüdü ki bugünü artık geçmişle gerçekten kıyaslayamayız . Ve geçmişte bazı şeyler daha kolaymış gibi görünse de, bugün sahip olduğumuz avantajları ve sayısız olasılığı ihmal ediyoruz. O zamanlar testler yazmadığımızda, hiçbir testimiz yoktu - yani başarıyı test etmenin güvenilir bir yolu yoktu. Dağıtım sürecimiz olmadığında, yeni bir sürüm yüklemek kolaydı, ancak bir şeyi kırmak da bir o kadar kolaydı - ve bu, Sürekli Entegrasyon sistemi yürürlükteyken bugün olduğundan çok daha fazla oldu.

Jeffrey Zeldman konuyla ilgili ilginç bir makale yazdı: “The Cult of Complex” gereksiz ayrıntılarda kendimizi nasıl kaybettiğimizi ve çoğu zaman sorunları fazla düşünmeye çalıştığımızı özetliyor. Çok karmaşık olmayan ancak makul miktarda sorumluluk gösteren (etik, gizlilik, güvenlik, harika bir kullanıcı deneyimi ve performans söz konusu olduğunda) ve güvenilir bir şekilde çalışan (testler, dağıtımlar, kullanılabilirlik ve tekrar performans). Sanırım doğru dengeyi bulma sorunu yakın zamanda ortadan kalkmayacak. Karmaşıklık her yerdedir - sadece karmaşıklığın yararlı olup olmadığına veya sadece daha kolay olduğu için mi yoksa orijinal problem üzerinde aşırı mühendislik yaptığımız için mi eklendiğine karar vermemiz gerekiyor.

Haberler

Yaklaşan Safari sürüm 12, Apple'ın WWDC'sinde tanıtıldı. İşte yenilikler: sekmelerdeki simgeler, güçlü parolalar ve ayrıca iki faktörlü kimlik doğrulama denetimi, bir 3D ve AR model görüntüleyici, iPad'lerde Tam Ekran API'si, font-display ve çok önemli gibi HTML öznitelikleri aracılığıyla bir parola oluşturucu denetimi, Her zamankinden daha kısıtlayıcı olan ve mevcut web sitelerinin işlevselliği üzerinde önemli bir etkisi olabilecek Intelligent Tracking Prevention 2.0.
Başsız Chrome otomasyon kitaplığı Puppeteer şimdi 1.5 sürümünde çıktı. Çerezleri ve genellikle sayfalar arasında paylaşılan diğer verileri izole etmek için Tarayıcı bağlamlarını beraberinde getirir ve Workers artık Web Workers ile etkileşim kurmak için de kullanılabilir.
Google, yeni bir rapor arayüzü, bazı puanlama değişiklikleri, bir CSV dışa aktarma ve First Contentful Paint ölçümü içeren performans analiz aracının üçüncü ana sürümü olan Lighthouse 3.0'ı piyasaya sürdü.
Chrome 67, Masaüstüne Aşamalı Web Uygulamaları getirmenin yanı sıra Genel Sensör API'si desteği ve USB aracılığıyla U2F kimlik doğrulayıcılarını desteklemek için Kimlik Bilgileri Yönetimi API'sini genişletiyor.
Geçtiğimiz aylarda tarayıcıların güvenlik arayüzlerinde oldukça fazla değişiklik gördük. İlk olarak, güvenli bağlantı (HTTPS) sunan siteleri vurguladılar. Ardından, güvenli olmayan siteleri belirtmeye karar verdiler ve şimdi Chrome, sonbaharda, HTTP sayfalarını "güvenli değil" olarak işaretleyerek HTTPS'yi varsayılan yapacak yeni değişikliklerin geleceğini duyurdu.

Chrome 67'de Masaüstü PWA — Masaüstü Aşamalı Web Uygulamaları artık Chrome OS 67'de desteklenmektedir ve Chrome ekibi şimdiden Mac ve Windows desteği üzerinde çalışmaya başlamıştır. (Resim kredisi)

Genel

Jeffrey Zeldman, The Cult of the Complex'te, yaptığımız her şeyin anahtarının ve amacının, projeler ve hayatın genel amacının basitlik olduğunu nasıl sık sık unuttuğumuz hakkında yazıyor. Karmaşık sistemleri geliştirmenin neden bu kadar zor olduğunu ve neden çok daha kolay ve cazip olduğunu açıklıyor. Çok iyi bir okuma ve kesinlikle 'herdem yeşil' listeme ekleyeceğim bir parça.
Heydon Pickering bize bir web bileşenini düzgün bir şekilde oluşturmayı öğreten yeni ve çok ilginç bir makale paylaştı: Bu sefer kapsayıcı ve duyarlı bir "Kart" modülünün nasıl oluşturulacağını açıklıyor.

kullanıcı arayüzü/UX

Cool Backgrounds, Moe Amaya'nın harika bir yan projesidir. Çok sayıda varyant ve şekil oluşturabilen degradelere sahip çokgen arka planlar için çevrimiçi bir oluşturucudur. Sadece güzel.

Takım

Ben Frain, neredeyse tüm modern kod editörlerinde bulunan bazı kullanışlı metin düzenleme tekniklerini paylaşıyor.

Güvenlik

DNS üzerinden yapılan güvenlik saldırıları popülerlik kazandıkça, HTTPS üzerinden DNS giderek daha fazla önem kazanıyor. Lin Clark, anlaşılmasını kolaylaştırmak için teknolojiyi bir karikatürle açıklıyor.
Windows Edge şimdi same-site tanımlama bilgileri için desteğin önizlemesini yapıyor. Çerezleri daha da fazla kilitleme özelliği Firefox ve Chrome'da zaten mevcut, bu nedenle Safari hala onu uygulaması gereken tek büyük tarayıcı, ancak sanırım Tech Preview yapılarına da çok yakında gelecek.

HTTPS Üzerinden DNS — Lin Clark, HTTPS üzerinden DNS ile kullanıcılarınızın gizliliğini nasıl daha iyi koruyabileceğinizi açıklamak için bir karikatür hazırladı. (Resim kredisi)

Mahremiyet

ACLU, Amazon'un artık resmi olarak kolluk kuvvetleriyle birlikte çalıştığını ve dünyanın dört bir yanındaki şehirlerde halihazırda kullanılan bir toplu yüz tanıma teknolojisi sağladığını keşfetti.

Web Performansı

KeyCDN, web performansı hakkında çok şey bilen 15 kişiden en iyi tavsiyelerini okuyucularla paylaşmalarını istedi. Şimdi de 2018 için çok sayıda faydalı performans ipucu içeren bu makaleyi paylaştılar, birkaç kelime de kendi kendime.
Stefan Judis, bir HTML başlık etiketi link rel="modulepreload" ekleyerek Chrome 66'da ECMA Komut Dosyası modüllerini önceden yükleyebileceğimizi keşfetti.

Ulaşılabilirlik

Örneğin, yükleme sırasında Tek Sayfa Uygulaması için bir yükleme döndürücü oluşturmak nispeten kolaydır, ancak bunları erişilebilir hale getirmeyi nadiren düşünüyoruz. Stuart Nelson şimdi nasıl yapılacağını açıklıyor.
Paul Stanton, en iyi sonuçları almak için hangi erişilebilirlik araçlarını kullanmamız gerektiğini paylaşıyor.

JavaScript

JavaScript son zamanlarda Elm, Rust, TypeScript, Babel veya Dart'ı tercih eden kişiler tarafından zorbalığa uğradı. Ancak Andrea Giammarchi'nin harika örneklerle açıkladığı gibi JavaScript kesinlikle daha kötü değil. Bu makale aynı zamanda, farkında olmamız gereken birkaç tuzak gösterdiğinden, bu diğer dillerden birini kullanan herkes için harika bir okumadır.
Birçok proje için, kişisel bilgileri toplayan analitik veya diğer komut dosyalarını kullanmak istiyoruz. GDPR yürürlükteyken, bu çok daha zorlaştı. Yett, bir kullanıcı kabul edene kadar bu tür kaynakların yürütülmesini engellemenize izin veren güzel bir JavaScript aracıdır.
Ryan Miller, “The Frontendian” adlı yeni bir yayın oluşturdu ve şimdiye kadar karşılaştığım CORS için en iyi açıklamalardan ve kılavuzlardan birini içeriyor.
Microsoft çalışanları, Web Push Bildirimlerinin nasıl olabileceğini ve nasıl görünmesi gerektiğini göstermek için hoş bir etkileşimli demo sayfası oluşturdu. Henüz teknolojiyi kavramadıysanız, her şeyin nasıl çalıştığı ve kullanıcıları rahatsız etmeyen bir arayüzün nasıl oluşturulacağı konusunda harika bir başlangıç.
Filepond, dosya yüklemek için bir JavaScript kitaplığıdır. Harika görünüyor ve React, Vue, Angular ve jQuery için birçok adaptörle birlikte geliyor.
React 16.4 çıktı ve kütüphaneye bir özellik daha getiriyor: Pointer Events. Kullanıcı etkileşimleriyle başa çıkmayı kolaylaştıracaklar ve uzun süredir talep ediliyorlar.

Frontendian — Temel astrolojik fikirler ile anında iletme bildirimi mimarisi arasındaki paralelliklerden ilham alan Microsoft'taki ekip, tarayıcının veya uygulamanın açılmasına gerek kalmadan bir kullanıcıya nasıl anında bildirim gönderileceğini açıklıyor. (Resim kredisi)

CSS

Oliver Schondorfer, web'de değişken yazı tipleriyle nasıl başlayacağımızı ve bunları CSS ile nasıl şekillendirebileceğimizi paylaşıyor. Göz önünde bulundurmanız gereken şeylerin ve olası tuzakların oldukça eksiksiz bir özeti.
Yaklaşan macOS Mojave'nin bir 'karanlık modu' desteklemesiyle Safari, hiçbir background-color açıkça ayarlanmadıysa web sitelerinin arka plan rengini otomatik olarak siyah renge ayarlamaya başlayacaktır. Bu, tarayıcıların varsayılan stillerini ayarlayıp değiştirebileceğini ve site varsayılanlarımızı dikkatli bir şekilde ayarlamamız gerektiğini hatırlatıyor. Hala 'karanlık modun' bir CSS Medya Sorgusuna maruz kalacağını umuyorum, böylece resmi olarak destek ekleyebiliriz.
Rafaela Ferro, yalnızca iyi görünmekle kalmayıp gerçekten harika görünen bir fotoğraf galerisi oluşturmak için CSS Izgarasının nasıl kullanılacağını paylaşıyor. Bu makale, Izgara düzeni hakkında konuşurken düzenli olarak aldığım birçok sorunun yanıtını içeriyor.
Marcin Wichary, modern CSS Özel Özellikleri ile kısa sürede nasıl karanlık bir tema oluşturabileceğimizi açıklıyor.

İş hayatı

Anton Sten, uygulamalarımız için ahlaki sonuçlar hakkında yazdı. Yapay Zeka, insanların yaşamlarını etkileyen sosyal ağlar ve GDPR tarafından zorunlu kılınan gizlilik konuları ile uğraşırken “hızlı hareket et ve işleri boz” zamanının neden kesinlikle sona erdiğinin anlamlı bir açıklaması.
Basecamp artık bir projenin durumunu görüntülemek için yeni bir grafik türüne sahip: "tepe grafiği" olarak adlandırılan, basit bir ilerleme çubuğunun yapabileceğinden daha iyi bir bağlam ekliyor.
Ben Werdmuller, özgeçmişler ve bunların kim olduğunuzu, ne yaptığınızı ve neden işe alınmanız gerektiğini yansıtmada her zaman nasıl başarısız olduğu hakkındaki düşüncelerini paylaşıyor.

Umarım bu aylık güncellemeyi beğenmişsinizdir. Bir sonraki 13 Temmuz'da planlanıyor, bu yüzden bizi izlemeye devam edin. Bu arada, yaptığım şeyi beğendiyseniz, lütfen Web Geliştirme Okuma Listesini finansal olarak finanse etmeme yardım etmeyi düşünün.

İyi günler!

— Anselm