Frontend
-
↗
SVG textPath path Özniteliği: Safari TP 253’te Metin Ayrı Yol İstemiyor
Safari Technology Preview 253, SVG textPath öğesine path özniteliğini getirdi: metin artık ayrı bir path öğesine bağlanmadan eğri boyunca akıyor. Tarayıcı desteğini, href yedeğini…
Okuma Süresi:
4–6 dakika -
↗
Container Query’leri Media Query Gibi Kullanmayı Bırakın
Container query’ler viewport’a değil, bileşenin kendi kapsayıcısına bakar. Media query alışkanlığının neden yanlış olduğunu gerçek kod örnekleriyle anlatıyoruz.
Okuma Süresi:
4–6 dakika -
↗
Figma’nın İçine 3D Render Motoru Nasıl Kuruldu? Depth Eklentisi
Depth, Figma eklenti penceresinde Three.js ile çalışan ücretsiz bir 3D render motoru. Mimarisini, performans kısıtlarını ve tanıtım sitesinin teknik kararlarını inceliyoruz.
Okuma Süresi:
6–10 dakika -
↗
Three.js, WebGPU ve TSL ile Sonsuz “Liquid Glass” Grid Nasıl Kuruluyor?
Codrops’ta yayımlanan Infinite Liquid Glass projesi, Apple’ın cam estetiğini tarayıcıya taşıyor. Cam efekti gerçek geometriyle değil, SDF ve kanal başına kırılmayla kuruluyor.
Okuma Süresi:
3–5 dakika -
↗
Hero Animasyonumuzu Açık Kaynak Yaptık: ballpit-js Nasıl Çalışıyor?
Sitemizin hero bölümündeki etkileşimli top havuzunu MIT lisansıyla açık kaynak yaptık. Verlet fizik çözücüsü, ortografik kamera tercihi, Fresnel halkası sorunu ve ölçülen performans sayıları.
Okuma Süresi:
4–6 dakika -
↗
Safari Sonunda Top-Level Await’i Tam Destekliyor
WebKit, Safari’nin 2016’dan kalma modül yükleyicisini native C++ ile yeniden yazdı. Top-level await artık Safari 27’de spesifikasyona tam uyumlu çalışıyor; işte değişen ve test…
Okuma Süresi:
3–4 dakika -
↗
Three.js’te Piksel Bütçeleme: Sinematik Sahneler İçin Performans Dersleri
Three.js’te piksel bütçeleme, draw call birleştirme, HDR post-processing ve p95 frame profiling’i FRONTIER projesinin gerçek verileriyle anlatıyoruz.
Okuma Süresi:
4–6 dakika -
↗
OKLCH’de Lightness Tuzağı: Palet Kurarken Dikkat
OKLCH’de lightness’i sabit chroma ile taramak bazı renkleri gamut dışına iter, tarayıcı sessizce kırpar. UX Collective ve gerçek örneklerle doğru yöntem.
Okuma Süresi:
5–7 dakika -
↗
SMIL ile JavaScript’siz SVG Animasyonu: Zamanlama Grafiğiyle Planlama
SMIL, etiketi içinde bile JavaScript olmadan SVG animasyonu çalıştırır. Zamanlama grafiği, syncbase senkronizasyonu ve birincil animasyon deseniyle SMIL’i yönetilebilir tutmanın rehberi.
Okuma Süresi:
3–5 dakika