Tailwind v4 + Vite + Alpine: küçük ama yeter stack

Modern web geliştirme, araç seçimiyle ilgili sonsuz bir tartışmadır. React mı Vue mu? Next.js mi Remix mi? Monorepo mu polyrepo mu? Çoğu zaman gerçek soru şu olmalı: bu sayfa için neye gerçekten ihtiyacım var?

Algow'un kendi sitesi bu sorunun bir cevabı. Stack: Tailwind v4 + Vite 6 + Vanilla JS + Alpine 3 + PHP 8.3. Olabildiğince az. Ne reddettik, ne aldık, hangi noktada pişman oluruz — burada.

Ne reddettik

React / Next.js.

Niye: içerik ağırlıklı bir kurumsal sitede React şu maliyetleri getiriyor:

• 40-80 KB react + react-dom framework bundle (dev mode 400 KB+)
• Hydration maliyeti (SSR ile bile ilk interactive'e kadar JS run süresi)
• Kod-split + image component + data-fetch gibi onlarca soyutlama katmanı
• Build süresi artar (bizde 0.6s, Next bile ilk build'de 10s+)

Karşılığında ne alıyorduk? Bir "Get a quote" butonu ve iki mobile menüsü için.

Tailwind v3.

V3 hâlâ çalışıyor ama:

• PostCSS config bağımlılığı IDE'de yavaş autocomplete
• CSS çıktısı v4'ten %30 daha büyük
• Container queries native değil
• Custom property tabanlı theming zorluydu

V4, CSS-first config ile bu sorunları çözüyor. Migration 1 saat sürdü.

jQuery / zurnar / eski jQuery plug-in ekosistemi.

2026'da hala bazı dev'ler "basit şeyler için jQuery" diyor. Yok. Web API'leri o kadar olgunlaştı ki document.querySelector, fetch, classList.toggle, IntersectionObserver — bunlar zaten native ve 0 KB.

Utility library'ler (lodash, date-fns).

• Array.prototype.groupBy artık native (Chrome 117+)
• Intl.DateTimeFormat date-fns'in %90'ını karşılıyor
• Custom util gerekiyorsa src/utils/ altında 10 satır fonksiyon yaz, yeter

Ne aldık

Alpine.js.

React alternatifi değil. Sadece reaktif x-data, x-show, @click için. 12 KB, HTML içinde direkt, JSX yok, build tooling yok.

Örnek — mobil drawer menü:

<nav x-data="{ open: false }">
    <button @click="open = !open">☰</button>
    <div x-show="open" x-transition>...</div>
</nav>

Bu kadar. Next.js'te state management + useEffect + framer-motion kombosu gerektiren bir işte vanilla Alpine 3 satır.

Vite 6.

Build tool olarak. 597 ms'de 6 chunk üretiyor, HMR anlık, tree-shaking ile utility CSS otomatik purging yapıyor. Webpack/esbuild/parcel ile karşılaştırma:

Sayılar kendi projemiz için, ama eğilim her yerde aynı.

Lenis (smooth scroll).

Aslında bu hafif bir lüks. Native scroll-behavior: smooth var ama browser'lar arasında easing farklı. Lenis sabit easing verir, scroll-linked animation için de API'si hazır. 8 KB. Sitenin karakterine katkısı var, bu yüzden kalıyor.

Motion (animasyon).

Motion One (Framer Motion'ın küçük versiyonu). Hero'da staggered reveal için. 12 KB. Replace edilebilir ama CSS @keyframes'ten daha yönetilebilir.

Kararsız kaldıklarımız

Parsedown (markdown → HTML).

Blog ve proje detay içerikleri markdown yazılıyor. Parsedown, PHP için en hızlı, en az bağımlı markdown parser'ı. Ama bazen extra feature'lar eksik (tablo başlıkları, footnote gibi). CommonMark PHP'ye geçmeyi düşünüyoruz.

Hostinger'ın managed MariaDB'si.

Ucuz, çalışıyor, remote access var. Ama backup gerçekten kritik olduğunda kendi MySQL dump'ımızı alacağız. Son commit'te bunu cron'a aldık.

Vanilla JS'in ömrü.

Site büyüdükçe state management karmaşık olursa Alpine.js yetmeyebilir. O gün gelirse Vue 3 composition API'ye geçebiliriz — JSX olmadan, build tooling minimal. React'a geri dönmeyeceğiz.

Ne öğrendik

Bundle size obsession value değil.

Önceden her KB'yi tıraşlamak için saatler harcardık. Şimdi ana sayfa 90 KB HTML + 27 KB JS + 54 KB CSS. Gzipped 35 KB toplam. Mobile 3G'de 0.8s'de indiriliyor. Bu yeterli.

Framework ekolojisi projeden büyük.

Next.js + React sitede düzinelerce @types/..., ESLint plug-in, prettier config, husky, lint-staged var. Her biri teori olarak faydalı. Pratikte: build'in %70'i framework tooling için. Biz basit tuttuk; devops yükü yarıya indi.

PHP modern bir dil.

Enums, named arguments, readonly class, typed properties, match expressions. Python'dan geri değil. "PHP eski" demek artık yanlış. 2026'da 8.3 yeterince modern.

Server-side rendering her koşulda kazanır (içerik siteleri için).

Hydration maliyeti, bundle size, first paint — SSR'de hep daha iyi. React Server Components yeni bir oyuncu ama aynı sonuca ulaştırıyor: server'a geri dön.

Son söz

Bu stack üç sene sonra değişmiş olabilir. Hiçbir karar sonsuza kadar doğru değil. Ama şu an, bu proje için, bu takım için — en basit olan çözüm aynı zamanda en hızlı olan çözüm. Karmaşıklığı ihtiyaçtan çıkmadıkça eklemiyoruz.

Bu bir manifesto değil bence. Bir hatırlatma: önce ne yapıldığı önemli, sonra nasıl.