Düzen kalıpları
Kartlar, dinamik ızgara alanları ve tam sayfa düzenleri gibi yaygın arayüzler oluşturmanıza yardımcı olmak için modern CSS API'leri kullanılarak oluşturulan düzen kalıpları.
- Uzun görevleri optimize edin
- Ödeme yöntemi ayarlama
- Modülleri önceden yükleyin
- Formlarınızda tarayıcı otomatik doldurma özelliğini ölçme
- 1. Bölüm: Online toksisiteyle mücadele için istemci tarafı yapay zeka
- 2. Bölüm: İstemci tarafında yapay zeka ile toksisite algılama özelliği oluşturma
- Toplam Engelleme Süresi (TBT)
- Core Web Vitals'ı iyileştirmenin en etkili yolları
- Web Verileri'ni ölçmeye başlama
- Largest Contentful Paint'i Optimize Edin
- Web Vitals
- LLM özelliğini özetlemeyle karşılaştırma
- CSS içerik görünürlüğü özelliği artık "Referans Yeni kullanılabilir" olarak değiştirildi
- Core Web Vitals metrik eşiklerinin tanımlanma şekli
- Laboratuvardaki yavaş etkileşimleri manuel olarak teşhis etme
- Google araçlarıyla Önemli Web Verileri iş akışları
- Referans değer
- Geri-ileri önbellek
- CSS iç içe yerleştirme, CSSNestedDeclarations ile iyileştirildi
- First Input Delay (FID)
- Sahadaki performansta hata ayıklama
- CSS @property özelliğinin performansını karşılaştırma
- İstemci tarafı yapay zeka için performansı ve kullanıcı deneyimini iyileştirin
- Core Web Vitals ile reklam gelirini Google araçlarıyla ilişkilendirme
- Ekran dışı iframe'leri geç yüklemenin zamanı geldi!
- Web için depolama alanı
- Aynı alanda birden fazla progresif web uygulaması oluşturma
- Web Push Protokolü
- Chrome, web uygulaması manifest dosyasında yapılan güncellemeleri nasıl işler?
- Yüklenebilir olmak için ne gerekir?
- İyi bir progresif web uygulaması olmak için neler gerekir?
- Web uygulaması manifest dosyası ekle
- Katı İçerik Güvenliği Politikası (İGP) ile siteler arası komut dosyası kullanımını (XSS) azaltın
- Web'deki donanım cihazlarına erişme
- İlgili kaynak istekleri ile sitelerinizde geçiş anahtarının yeniden kullanılmasına izin verin
- Doğru resim biçimini seçin
- Web için tarayıcı düzeyinde resim geç yükleme
- Özel metrikler
- Google Analytics 4 ve BigQuery ile performansı ölçme ve hata ayıklama
- Web izinleriyle ilgili en iyi uygulamalar
- Çerez bildirimleri için en iyi uygulamalar
- Media Session API'si ile medya bildirimlerini ve oynatma kontrollerini özelleştirme
- Sekme dizinini kullanma
- Alandaki yavaş etkileşimleri bulma
- İlk Bayt Zamanı (TTFB)
- Daha küçük LLM'ler için pratik hızlı mühendislik
- İlk Bayt Zamanı Optimizasyonu
- Sonraki boyamayla etkileşim (INP)
- Light-dark() ile CSS renk şemasına bağlı renkler
- Web uygulamaları için WebAssembly performans kalıpları
- CSS animasyonlu ızgara düzenleri
- Oyun kumandanızla Chrome dinozor oyununu oynayın
- Inert özelliği
- Yapay Zeka nedir?
- Site aramanızı bir üst seviyeye taşıyın: Üretken yapay zeka ile içeriğe dayalı yanıtlar
- Web.dev AI Ekibi ile tanışın
- Etik ve yapay zeka
- AAGUID ile geçiş anahtarı sağlayıcısını belirleme
- Binaryen ile Wasm için derleme ve optimize etme
- HTML5 ile ses ve video yakalama
- <Model-viewer> web bileşeni
- kullanıcıDoğrulama ile ilgili ayrıntılı inceleme
- CrUX verileri neden RUM verilerimden farklı?
- Web geliştiricileri için erişilebilirlik
- Üçüncü Taraf JavaScript Yükleme
- Largest Contentful Paint (LCP)
- Zaten varsa yeni bir geçiş anahtarı oluşturulmasını engelle
- IndexedDB ile çalışma
- Her kullanıcı arabirimi geliştiricisinin 2024'te bilmesi gereken 5 CSS snippet'i
- URL bölümleri nelerdir?
- Keşfedilebilir kimlik bilgilerinin ayrıntılı incelemesi
- Oluşturma performansı
- RedirectObserver: Öğeler için document.onresize gibidir
- Metin tabanlı öğelerin kodlama ve aktarım boyutunu optimize edin
- OffscreenCanvas: Bir web çalışanıyla tuval işlemlerinizi hızlandırın
- First Contentful Paint (FCP)
- İçerik yayınlama ağları (CDN)
- İyi bir oturum kapatma deneyiminin özellikleri nelerdir?
- Etkileşime Hazır Olma Süresi (TTI)
- Fetch Priority API ile kaynak yüklemesini optimize etme
- :user-valid ve :user-invalid sözde sınıfları
- İşle ilgili karar mercileri için Core Web Vitals'ı optimize edin
- JavaScript'te base64 kodlama dizelerinin nüansları
- CSS alt ızgarası
- Sayfa hızını etkilemeden reklamları etkili bir şekilde yükleme
- Yaygın olarak kullanılan dört kod kapsamı türü
- Test etmek veya test etmemek, teknik açıdan
- Test senaryolarını ve önceliklerini tanımlama
- Kullanıcı odaklı performans metrikleri
- Duyarlı resimleri önceden yükleme
- CSS ile yazıyı kullanıcı tercihlerine uyarlama
- Piramit mi Yengeç mi? Size uygun bir test stratejisi bulun
- Yaygın olarak kullanılan üç test otomasyonu türü
- Gereksiz İndirmeleri Ortadan Kaldırma
- mkbitmap'i WebAssembly'ye derleme
- WebAssembly nedir ve nereden geldi?
- Kaynak gizli dosya sistemi
- Kullanıcı verilerini modern web uygulamalarında güvenli bir şekilde barındırma
- Daha duyarlı web siteleri için AVIF'yi dağıtma
- Sonraki boyamayla etkileşimi optimize edin
- Bugün kullanabileceğiniz temel özellikler
- Komut dosyası değerlendirmesi ve uzun görevler
- Büyük DOM boyutlarının etkileşimi ne ölçüde etkilediği ve bu konuda neler yapılabileceği
- HTML ve etkileşim için istemci tarafı oluşturma
- Giriş gecikmesini optimize edin
- Önemli Web Verileri sorunlarını ayıklamak için Web Verileri uzantısını kullanma
- Cumulative Layout Shift'i Optimize Etme
- WordPress Playground ve WebAssembly ile tarayıcı içi WordPress deneyimleri oluşturun
- Cumulative Layout Shift (CLS)
- WebAssembly tarafından kullanıma sunulan, geliştiriciler için yeni işlevler
- Uygulama mağazalarında PWA'lar
- Kaynak haritaları nedir?
- Her kullanıcı arabirimi geliştiricisinin 2023'te bilmesi gereken 6 CSS snippet'i
- CSS'deki trigonometrik işlevler
- requestVideoFrameCallback() ile videoda video karesi başına verimli işlemler gerçekleştirin
- GDE topluluğunda öne çıkanlar: Lars Knudsen
- Medya uygulamaları için yeni kalıplar
- CSS İpucu! Animasyonlu Gradyan Metin
- Chrometober oluşturuluyor!
- İpucu bileşeni oluşturma
- Şifresiz girişler için geçiş anahtarı oluşturma
- Formları otomatik doldurma aracılığıyla geçiş anahtarıyla oturum açma
- Kayan işlem düğmesi (FAB) bileşeni oluşturma
- Yazı tipleriyle ilgili en iyi uygulamalar
- Web Tasarımı Renk Kontrastı Testi
- CSS İpucu! Animasyonlu Yükleyici
- GDE topluluğunda öne çıkanlar: Alba Silvente Fuentes
- Bir web sitesi için ana gezinme sistemini oluşturma
- :modal mi?
- Reklam öğesi listesi stili
- Etiketler ve etiket yöneticileri için en iyi uygulamalar
- Eğri ızgara illüzyonu oluşturma
- Nordhealth'in Web Bileşenlerinde Özel Mülkleri Nasıl Kullandığı
- Ayrı dönüşüm özellikleriyle CSS dönüşümleri üzerinde daha ayrıntılı kontrol
- CSS kenarlık animasyonları
- BBC daha iyi güvenlik ve performans için HSTS'yi nasıl kullanıma sunuyor?
- Laboratuvar ve alan verileri neden farklı olabilir (ve bu konuda ne yapılmalı?)
- İki tarafın da kazanacağı bir durum
- Internet Explorer'ın sonu
- HTML5Rocks'a veda
- Birinci taraf kurabiye tarifleri
- Web'de ses ve video oynatmayı senkronize edin.
- Havalı bir kenarlık oluşturmak için konik gradyanlar kullanın
- Getirme API'sini kullanırken hata işlemeyi uygulama
- JavaScript kitaplıkları ve çerçeveler arasındaki fark
- JavaScript kitaplığı veya çerçevesi seçin
- Hızlı ve güzel web yazı tipleri API'si
- Kullanıcı Arabirimi Geliştiricisi Terminal Kılavuzu
- GOV.UK, kullanıcı arabiriminden jQuery'yi kaldırıyor.
- Düğme bileşeni oluşturma
- Tarayıcının önceden yükleme tarayıcısıyla mücadele etmeyin
- Boşluğu doldurmak
- Sahada Web Verileri'ni ölçmek için en iyi uygulamalar
- Geliştirici topluluğunda cesaret ve ilham bulma
- Gerçek hayatta değişken yazı tipleri
- CSS Gradient Creator ile hızlı şekilde güzel CSS renk geçişleri oluşturun
- Web geliştiricilerinin en sık karşılaştığı sorunları ayrıntılı olarak inceleyin
- images.tooling.report ile sitenizin resmini mükemmel hale getirin
- Genel ve yerel değişken kapsamı
- İletişim kutusu bileşeni oluşturma
- Web'de medya oynatma hatalarını ayıklama
- GDE topluluğunda öne çıkanlar: Nishu Goel
- Çok fazla geç yüklemenin performans etkileri
- Yükleme çubuğu bileşeni oluşturma
- Formlar'daki Kimlik Bilgilerini Kaydet
- Chrome ve Firefox yakında ana sürüm 100'e ulaşacak
- Uyarlanabilir site simgesi oluşturma
- HTTP Önbelleğini güncelleyerek güvenliği ve gizliliği artırın
- Emscripten'da kanvasa çizim
- Ek HTML öğeleri
- USB uygulamaları web'e bağlanıyor. 2. Bölüm: gPhoto2
- Ağ Hatası Günlük Kaydı (NEL)
- WebAssembly özellik algılama
- USB uygulamaları web'e bağlanıyor. 1. Bölüm: Libusb
- Tema değiştirme bileşeni oluşturma
- Emscripten ile C++'ya JavaScript snippet'leri yerleştirme
- Oculus Quest 2'de PWA'lar
- Bina Tasarım Ekibi
- Designcember Hesap Makinesi
- ConfigureClone kullanarak JavaScript'te derin kopyalama
- Toast bileşeni oluşturma
- UI fonu
- 3D oyun menü bileşeni oluşturma
- PageSpeed Insights'taki yenilikler
- Lighthouse kullanıcı işlemleri akışları
- Chrome Dev Summit 2021'de duyurulan her şey
- Animasyon yumuşaklığı metriğine doğru
- Photoshop'un web yolculuğu
- Çoklu seçim bileşeni oluşturma
- Gezinme zamanlaması ve kaynak zamanlaması ile sahada yükleme performansını değerlendirme
- Sanitizer API ile güvenli DOM işleme
- Üçüncü taraf yerleşik öğeleri kullanmak için en iyi uygulamalar
- SPA mimarileri Önemli Web Verileri'ni nasıl etkiler?
- JavaScript etkinlik ayrıntılı incelemesi
- JavaScript olmayan kaynakları paket haline getirme
- Bölme düğmesi bileşeni oluşturma
- Stil sayfalarını içe aktarmak için CSS Modülü Komut Dosyalarını kullanma
- Anahtar bileşeni oluşturma
- CSS vurgu rengi
- Kullanıcı tercihi medya özellikleri istemci ipucu üstbilgileri
- İçerik haritası bileşeni oluşturma
- C, C++ ve Rust'tan WebAssembly iş parçacıklarını kullanma
- Medya akışıyla ilgili temel bilgiler
- Çevrimdışı yayın özellikli PWA
- Medya şifrelemesi
- Medya çerçeveleri
- Web Verileri uzantı güncellemesinde alan verileriyle yolunuzu bulun
- Renk şeması oluşturma
- @font-face için CSS boyut düzenlemesi
- Sitenizdeki resimleri sıkıştırmak için AVIF kullanma
- Web araçlarında gelişen Cumulative Layout Shift
- Web Verileri için CSS
- Yeni CSS işlevsel sözde sınıf seçiciler :is() ve :where()
- Yeni Progresif Web Uygulaması eğitimi kullanıma sunuldu
- Yeni duyarlı içerik: Bileşen odaklı bir dünyada web tasarımı
- Kullanıcı Aracısı İstemci İpuçlarına Taşı
- Güvenlik üstbilgileri hızlı başvuru
- Excalidraw ve Fugu: Temel Kullanıcı Yolculuklarını İyileştirme
- Service Worker'larda ES modülleri
- Medya kaydırma çubuğu bileşeni oluşturma
- Lighthouse'u kullanarak Web Verileri'ni optimize etme
- WebAssembly'den eşzamansız web API'lerini kullanma
- Üçüncü taraf komut dosyalarını kontrol altında tutma
- PWA'nızın başlık çubuğunun pencere kontrolleri yer paylaşımını özelleştirin
- DataTransfer API'yi kullanarak bariyerleri ortadan kaldırma
- Kaynaklar arası iframe'lerde OTP formlarını WebOTP API ile doldurma
- Bölünmüş metin animasyonları oluşturma
- CLS metriğini geliştirme
- Web Geliştirici Memnuniyeti
- Ayarlar bileşeni oluşturma
- Düzen kaymalarında hata ayıklama
- JavaScript: Bunun anlamı nedir?
- Mini uygulama bileşenleri
- Proje yapısı, yaşam döngüsü ve paketler
- Mini uygulama programlama ilkelerini örnek bir projeye uygulama
- Bir web geliştiricisinin mini uygulamalarla ilgili düşüncelerini sonuçlandırma
- Mini uygulama işaretleme, stil oluşturma, komut dosyası oluşturma ve güncelleme
- Mini uygulama açık kaynak projeleri
- Mini uygulama yöntemini programlama
- H5 ve QuickApp nedir?
- Akışlar: Ayrıntılı kılavuz
- Sekmeler bileşeni oluşturma
- Kökler arası erişimi etkinleştirme rehberi
- Origin-Agent-Cluster başlığıyla performans yalıtımı isteme
- CSS aspect-ratio özelliği
- WebRTC artık bir W3C ve IETF standardı
- Bantlar için en iyi uygulamalar
- Yerel geliştirme için HTTPS kullanma
- Geri bildirim isteniyor: Uzun süreli sayfalar için daha iyi bir düzen kayması metriğine giden yol
- Yerel geliştirme için HTTPS ne zaman kullanılır?
- Codelab: Sidenav bileşeni oluşturma
- Yan gezinme bileşeni oluşturma
- Codelab: CSS'de ortalama
- CSS'de ortalama
- Önbelleğinizi seviyorum ❤️
- Daha hızlı uygulamalar için modern JavaScript'i yayınlayın, gönderin ve yükleyin
- Tarayıcılar arası boyama işcıkları ve Houdini.how
- Kayıt formu en iyi uygulamaları codelab'i
- Kayıt formu en iyi uygulamaları
- AutoWebPerf ile denetimleri otomatikleştirme
- SMS OTP formu en iyi uygulamaları
- Adres formuyla ilgili en iyi uygulamalar codelab'i
- Ödeme formuyla ilgili en iyi uygulamalar codelab'i
- Ödeme ve adres formu için en iyi uygulamalar
- Service Worker'larla iki yönlü iletişim
- Çalışanlara genel bakış
- zorunluluk önbelleğe alma kılavuzu
- Service Worker'ları içeren sayfalarda güncellemeler yayınlama
- Daha iyi bir FPS oyun deneyimi sunmak için fare hızlandırmayı devre dışı bırakın
- Hikayeler bileşeni oluşturma
- Codelab: Hikayeler bileşeni oluşturma
- İçerik yönetim sistemleri için tarayıcı düzeyinde geç yükleme
- Düzenli Aynı Site
- Codelab: Push bildirim sunucusu oluşturma
- Codelab: Push bildirimi istemcisi oluşturma
- Push bildirimlerine genel bakış
- Çevrimdışı kullanımı ölçme
- Yüksek performanslı CSS animasyonlarına örnekler
- İmzalı Takaslar (SXG'ler)
- CSS min(), max() ve clamp()
- Akışa göre kısaltmalarla mantıksal düzen geliştirmeleri
- Yüksek performanslı CSS animasyonları oluşturma
- Service Worker'da aralık isteklerini işleme
- Bazı animasyonlar neden yavaş?
- Kamera kaydırma, yatırma ve yakınlaştırmayı denetleyin
- Üçüncü taraf kaynak denemeleri nedir?
- Ayrılan pencere bellek sızıntıları
- Çevrimdışı yedek sayfa oluşturma
- Core Web Vitals
- CSS's Clip-path özelliği ile ilginç resim şekilleri oluşturun
- CSS' maskeleme resmi özelliği ile resimlere efekt uygulayın
- CSS ::marker ile özel madde işaretleri
- Şifre değiştirme işleminde iyi bilinen bir URL ekleyerek kullanıcıların şifre değiştirmelerine yardımcı olun
- İsteğe bağlı ödeme bilgilerini hizmet çalışanıyla işleme
- Ödeme işlemlerini bir hizmet çalışanıyla düzenleme
- ARIA: zehir mi yoksa panzehir mi?
- Emscripten'ı kullanarak WebAssembly'de bellek sızıntılarının hatalarını ayıklama
- content-visible: oluşturma performansınızı artıran yeni CSS özelliği
- Pano erişiminin engeli kaldırılıyor
- Yönlendiren ve Yönlendiren Politikası ile ilgili en iyi uygulamalar
- Android'de web
- Google'da PWA oluşturma, 1. bölüm
- Lighthouse CI ile performans izleme
- Google hesaplarındaki geçiş anahtarlarının kullanıcı deneyimini tasarlama
- @property: CSS değişkenlerine süper güçler verme
- Android ödeme uygulamasından gönderim ve iletişim bilgileri sağlama
- Service Worker önbelleğe alma ve HTTP önbelleğe alma
- Web tabanlı bir ödeme uygulamasını kaydetme
- Web tabanlı ödeme uygulamalarına genel bakış
- Site hızı ve işletme metrikleri hakkında
- Sahadaki performansı incelemek için Chrome Kullanıcı Deneyimi Raporu'nu kullanma
- Gezinme isteklerini işleme
- Bir CSS satırında on modern düzen
- devicePixelContentBox ile piksel mükemmelliğinde oluşturma
- web.dev CANLI özeti
- Oturum açma formu oluşturmak için platformlar arası tarayıcı özelliklerini kullanma
- Oturum açma formuyla ilgili en iyi uygulamalar
- Progresif Web Uygulamanızı kademeli olarak iyileştirin
- Google Arama'da JavaScript sorunlarını gidermek için web geliştiricisi araçları
- Workbox ile esnek arama deneyimleri oluşturma
- Web sayfasına medya ekleme
- Daha önce hiç kimsenin bağlantı kurmadığı yerlerde kalın bağlantı oluşturun: Metin Parçaları
- PWA'nızın bir uygulamaya daha benzer hale gelmesini sağlayın
- İyi bir tarayıcı hatası bildirme
- Performansı RAIL modeliyle ölçme
- Quicklink ile React'ta gezinmeyi hızlandırın
- Meta Verileri Getirme özelliğiyle kaynaklarınızı web saldırılarına karşı koruyun
- İçerik yeniden sıralanıyor
- Chromium 84'te Web Animations API iyileştirmeleri
- Android ödeme uygulaması geliştiricileri kılavuzu
- Ödeme işleminin ömrü
- Ödeme uygulamalarını Web Ödemeleri ile destekleme
- Chromium 83'teki macOS system-ui yazı tipi için daha fazla değişken yazı tipi seçenekleri
- Progresif Web Uygulamaları işletmelerin başarısını nasıl artırabilir?
- Uygulama kısayollarıyla işlerinizi hızlıca tamamlayın
- AppCache'i kaldırmaya hazırlanma
- Yükleme stratejinizi belirleme
- Kalıcı depolama alanı
- CommonJS paketlerinizi nasıl büyütüyor?
- Güçlü özellikler için neden "köşeler arası erişime kapalı" olması gerekir?
- Chrome'da Web Ses uygulamalarının profilini oluşturma
- Ayrıntılı ögelemeyle, Next.js ve Gatsby sayfa yükleme performansı iyileştirildi
- "Aynı site" ve "aynı kaynak"
- Web sayfanızın toplam bellek kullanımını measurementUserAgentspecificMemory() ile izleyin
- COOP ve COEP kullanarak web sitenizi "kökenler arası erişime kapalı" hale getirme
- web.dev mühendislik blogu 1: Siteyi nasıl oluşturuyoruz ve Web Bileşenleri'ni nasıl kullanıyoruz?
- Renk şeması CSS özelliği ve karşılık gelen meta etiketle koyu mod varsayılan stili iyileştirildi
- Web sitenizin COVID-19 sürecinde herkes tarafından erişilebilir ve kullanılabilir olmasını sağlayın
- Erişilebilir duyarlı tasarım
- Renk ve kontrast erişilebilirliği
- Aşırı yüklenmiş sunucuyu düzeltme
- Erişilebilir dokunma hedefleri
- Güvenilir Türler ile DOM tabanlı siteler arası komut dosyası oluşturma güvenlik açıklarını önleyin
- Android uygulamanızda PWA (Progresif Web Uygulaması) kullanma
- İsteğe bağlı yazı tiplerini önceden yükleyerek düzen kaymasını ve görünmez metnin (FOIT) yanıp sönmesini önleyin
- İmzalanmış HTTP Takasları (SXG) nginx kullanılarak nasıl dağıtılır?
- nginx kullanarak İmzalanmış HTTP Değişimleri (SXG) ayarlama
- CSS arka plan resimlerini medya sorgularıyla optimize etme
- Web sitesi hızını işlevler arası sorunları çözme
- Düzen değişikliklerinden sonra kaydırma yapışma
- Web Paketleyici'yi kullanarak İmzalı Takasları ayarlama
- Kendi uygulama içi yükleme deneyiminizi sunma
- Sanal nesneleri gerçek dünya görünümlerinde konumlandırma
- Artırılmış gerçeklik: Bunu zaten biliyor olabilirsiniz
- Sanal gerçeklik web'e geliyor, 2. bölüm
- Web çerçevesi ekosistemini geliştirme
- Progresif Web Uygulamaları nedir?
- Workbox ile PWA'ları yerleşik paylaşım kullanıcı arayüzlerine entegre edin
- PWA'larda maskelenebilir simgelerle uyarlanabilir simge desteği
- Eşzamanlı XMLHttpRequest() işlevinde sayfa kapatmayı iyileştirme
- Modül çalışanlarıyla web'de mesaj dizisi oluşturma
- Hız aracıyla ilgili gelişmeler: Chrome Geliştirici Zirvesi 2019'da öne çıkanlar
- Uyarlanabilir yükleme: Yavaş cihazlarda web performansını iyileştirme
- JavaScript'i tarayıcının ana iş parçacığı dışında çalıştırmak için web çalışanlarını kullanın
- 2019 yaz resim optimizasyonu anketinden alınan geri bildirimler
- Push bildirimleri sunucusu oluşturma
- Next.js ile varsayılan performans
- AMP, Next.js uygulamanızda hızı nasıl garanti edebilir?
- Next.js'de dinamik içe aktarmalarla kod bölme
- Web Paylaşımı API'si ile işletim sistemi paylaşımı kullanıcı arayüzü ile entegrasyon
- Next.js'de yönlendirme önceden getirme
- Sanal gerçeklik web'e geliyor
- SameSite kurabiye tarifleri
- Çerezleri anlama
- Hızlı reklamlar önemlidir
- Kullanıcılarla etkileşime geçmek ve kullanıcılarla yeniden etkileşime geçmek için push bildirimlerini kullanma
- Bildirimler API'sini kullanmaya başlama
- Bildirimleri yönetmek için Service Worker kullanma
- Düzen kararsızlığını düzeltme
- Özellikli telefonlarda bile bir web uygulamasını hızlı yükleme teknikleri
- Houdini'nin yeni API'si ile daha akıllı özel mülkler
- Gelecekteki gezinmeleri hızlandırmak için kaynakları önceden yükleme
- Önceden getirmenin iki yolu: <link> etiketleri ve HTTP üstbilgileri
- Karma içerik düzeltiliyor
- Karma içerik nedir?
- Web için temel videolarla resimlerin ötesine geçin
- Progresif Web Uygulamanıza Apple dokunma simgesi ekleme
- Hazır Oynatıcı Web
- Çok kaynaklı sitelerdeki progresif web uygulamaları
- Web yazı tipi boyutunu küçült
- WebFont'un yüklenmesini ve oluşturulmasını optimize edin
- Angular KSA ile Progresif Web Uygulaması oluşturma
- Üçüncü taraf JavaScript'i verimli bir şekilde yükleyin
- Yavaş üçüncü taraf JavaScript'i tanımlama
- Resimleri optimize etmek için resim CDN'lerini kullanma
- Üçüncü taraf JavaScript performansı
- Üçüncü taraf JavaScript'i optimize edin
- Daha özellikli form kontrolleri
- Algılanan sayfa hızını iyileştirmek için ağ bağlantılarını erkenden oluşturun
- Arka plan filtresiyle OS tarzı arka planlar oluşturun
- Yeniden doğrulama yöntemiyle eski içeriği güncel tutma
- Angular CDK ile büyük listeleri sanallaştırın
- Angular'da rota önceden yükleme stratejileri
- Angular'ın değişiklik algılamasını optimize etme
- Tahmine dayalı önceden getirme özelliğiyle web'de daha hızlı gezinme
- Ağ kalitesine bağlı olarak videoyu resim sunmaya uyarlayın
- Kodlayıcı ile Angular uygulamanızın erişilebilirliğini denetleyin
- Angular KSA ile performans bütçeleri
- Angular hizmet çalışanı ile önbelleğe alma
- Preferreds-color-scheme: "Merhaba karanlık, eski dostum
- Başlayın: Angular uygulamasını optimize etme
- Angular'da rota düzeyinde kod bölme
- Web performansı için en iyi ipuçları
- Web bileşenleri: Web'in güçlenmesine yardımcı olan gizli bileşen
- Performans bütçeleri için Lighthouse'u kullanma
- Web Payments API'lerinde yapılan güncellemeler
- Hızın değeri
- Masaüstünde Progresif Web Uygulamaları İçin Adres Çubuğu Yüklemesi
- Performans, dönüşümü nasıl artırabilir?
- Kullanıcılara PWA'mın yüklenebilir olduğunu nasıl bildiririm?
- Hizmet çalışanı düşünce yapısı
- PWA (Progresif Web Uygulaması) yüklemeyi teşvik etme şablonları
- Hızlı yükleme süreleri ve daha fazlası için resim politikaları
- Kritik ile kritik CSS'leri ayıklama ve satır içine alma
- Uzun JavaScript görevleri Etkileşime Hazır Olma Sürenizi geciktiriyor mu?
- Kritik CSS'leri ayıklama
- Geniş ölçekte hız: Web performansındaki yenilikler neler?
- PROXX ile tanışın
- SameSite çerezleri hakkında açıklama
- Web Algısı Araç Seti ile görsel arama
- Ağ kalitesine göre uyarlanabilir sunum
- Portallar ile uygulamalı: web'de sorunsuz gezinme
- Brotli ile ağ yüklerini küçültün ve sıkıştırın
- I/O 2019'da web.dev
- Nasıl hızlı kalınır?
- Hız nedir?
- Hız nasıl ölçülür?
- Create React App ile bir web uygulaması manifesti ekleme
- Tepki penceresi ile büyük listeleri sanalleştirin
- React.lazy ve Suspense ile kod bölme
- react-axe ve eslint-plugin-jsx-a11y ile erişilebilirlik denetimi
- Create React Uygulamasında Workbox ile Önbelleğe Alma
- Tepki tutturma özellikli rotaları önceden oluşturma
- Başlayın: React uygulamanızı optimize etme
- Codelab: Yükleme hızını iyileştirmek için önemli öğeleri önceden yükleme
- azaltılmış-hareketi tercih eder: Bazen daha az hareket daha çok
- Kritik olmayan CSS'leri ertele
- Güvenmek iyidir, gözlem daha iyi: Intersection Observer v2
- Duyarlı web tasarımıyla ilgili temel bilgiler
- Yapılandırılabilir Stil Sayfaları
- Web'de oluşturma
- Derleme sürecinize performans bütçelerini dahil edin
- Travis CI ile paket boyutunu kullanma
- Webpack ile performans bütçeleri belirleme
- Performans bütçesi belirlemek için Lighthouse Bot'u kullanma
- Emscripten ve npm
- Uygulamanız yüklü mü? getInstallInstallRelatedApps() bunu size bildirir!
- Sayfaların daha hızlı yüklenmesi için modern tarayıcılara modern kod sunma
- İstemci İpuçlarıyla Kullanıcılara Uyum Sağlama
- Erişilebilirlik nedir?
- Anlamsal bilgiler ve ekran okuyucular
- Başlıklar ve önemli noktalar
- Stil odağı
- Sekme diziniyle odağı kontrol etme
- Etiketler ve metin alternatifleri
- Klavyede kolay kazanımlar için semantik HTML kullanın
- Klavye erişimiyle ilgili temel bilgiler
- Yüklenebilir hale getirin
- Kullanılmayan kodu kaldırın
- Performans bütçeleri 101
- Lighthouse ile arama motoru optimizasyonunu ölçme
- Sanat yönetimi
- Resimleri doğru boyutlarda sunma
- Kod bölmeyle JavaScript yüklerini azaltın
- Birden çok alan genişliği belirtme
- HTTP Önbelleği ile gereksiz ağ isteklerini önleme
- Çalışma kutusu: üst düzey Service Worker araç setiniz
- Sayfaların daha hızlı yüklenmesi için animasyonlu GIF'leri videoyla değiştirin
- Kullanılmayan kodu kaldırın
- GIF'leri videoyla değiştirin
- Lighthouse ile performans fırsatlarını keşfedin
- Tarayıcı korumalı alanı
- Komut Satırıyla WebP Görüntüleri Oluşturma
- Aynı Kaynak Politikası ve Getirme istekleri
- Yoğunluk açıklayıcıları kullanın
- Güvenlik saldırıları nedir?
- Resimleri sıkıştırmak için Imagemin'i kullanma
- PRPL kalıbıyla anında yüklemeyi uygula
- İlk performans bütçeniz
- Hizmet çalışanları ve Cache Storage API