01
Minimal ve hızlı
Tam HTML sunucudan. React runtime yok, hydration şelalesi yok — yalnızca bir içerik sayfasının ihtiyaç duyduğu baytlar.
Açık kaynak · Modern web için · Node.js 22+ · MIT lisanslı
Web'in iskeleti.
Web'in iskeleti.
Fazlası değil.
İçerik siteleri için yalın, yüksek performanslı bir temel. Tam HTML sunucudan gelir, island yalnızca dokunduğunuz yerde uyanır, cache ziyaretçi istemeden hazırdır.
Başla
$ npx jskelet init
Minimal ayak izi
Şimşek hızında
Geliştirici için
Neden JSkelet
Yolunuzdan çekilen bir framework.
Sunucu içeriği hazırlar, cache beklemeyi kaldırır, island'lar yalnızca sayfanın gerçekten ihtiyaç duyduğu davranışı ekler.
02
Modüler
Menü, sayaç veya grafik kendi island'ında yaşar. Modülü yalnızca görünür olunca iner.
03
Geliştirici odaklı
Düz async controller, .jsk şablon ve küçük bir API. Tören olmadan okunur, drama olmadan değiştirilir.
Şeffaf performans
Hafif demiyoruz. Gösteriyoruz.
Bu değerler gerçek build çıktısından okunuyor ve gzip sonrası ağırlığı gösteriyor. Pazarlama sözü değil, çalışan kod.
| Ham | gzip | |
|---|---|---|
| Stylesheet (Tailwind v4 çıktısı) | 79.4 kB | 13.9 kB |
| Client entry (island yükleyicisi) | 593 B | 287 B |
| İkon sprite'ı | 12.5 kB | 4.0 kB |
| Tüm island'lar (talep üzerine, ayrı chunk'lar) | 73.5 kB | 28.4 kB |
| Toplam — her island yüklenirse | 166.0 kB | 46.5 kB |
46.5 kB
Her şey dahil (gzip)
Stylesheet, entry, sprite ve sitedeki bütün island'lar birlikte. Tek bir sayfa bunun hepsini indirmiyor.
0
Web font isteği
Sistem font yığını. FOUT ve font kaynaklı düzen kayması yok.
1
Render'ı bloke eden istek
Tek stylesheet. Client entry modül olduğu için defer edilmiş.
2
Hemen inen island
Tema ve mobil menü. Diğer island'ların hepsi görünürlüğe girene kadar bekler.
Karşılaştırılabilir bir sayı istiyorsanız kendi projenizi aynı şekilde ölçün: bir aracın hafif olduğu iddiası, ancak sizin sayfanızda ölçüldüğünde bir şey ifade eder.
Tasarım gereği basit
Daha az yaz. Daha çok kur.
Stale-while-revalidate ziyaretçiyi render kuyruğundan çıkarır. Bir route, bir TTL, tahmin edilebilir davranış.
- Cache anahtarı yol ve query — locale Host'taysa cache().vary.host ekleyin; bir dilin HTML'i diğerine sızmasın.
- Taze girdiler TTL bitmeden arka planda yenilenir; boşta kalanlar soft-stale olur ve klasik prewarm listesi olmasa da HTTP üzerinden boşalır.
- Açılışta yol listesinden prewarm, ya da her public yanıttan sonra onVisit ile same-origin linkler — iki moddan birini seçin, ikisini birden değil.
- Nokta atışı geçersizleme yerleşik: invalidateHtmlCache() bir yolu, deseni veya listeyi tümünü boşaltmadan bayatlatır.
routes/10-pages.mjs
export default function register(app, { route, notFound }) {
app.get("/", route(
async () => ({
view: "pages/home",
data: { pillars },
}),
{ revalidate: 3600 },
));
app.get("/product/:slug", route(async ({ params }) => {
const product = await getProduct(params.slug);
if (!product) notFound();
return { view: "pages/product", data: { product } };
}));
}Görünen ops
Redis, yönetim paneli, Cloudflare — ikinci bir ürün eklemeden.
HTML cache süreç belleğinde başlar. Bir anahtar çevirince aynı anahtarlar kopyalar arasında paylaşılır, sertleştirilmiş panel açılır ve edge ile konuşur.
Paylaşılan katman
Önce bellek. Ölçeklenince Redis.
L1 mikrosaniye HIT için süreç içinde kalır. Redis paylaşılan HTML/data gövdelerini tutar ve invalidateHtmlCache() / clearHtmlCache() çağrılarını pub/sub ile her kopyaya yayar — ioredis isteğe bağlı; yoksa yalnızca L1.
Birincil store
Süreç içi L1
Paylaşılan gövde
Redis HTML + data
Yayılım
Pub/sub invalidate
Doğru eşleşme
Her işi yapmaya çalışmaz.
Merkezde herkese aynı, cache'lenebilir sayfalar var. Oturumlu dashboard ve kişiye özel paneller private: true ile desteklenir — HTML cache'e girmezler. React SPA ya da gömülü bir gerçek zamanlı istemci olmak istemez.
İyi uyum
- İçerik siteleri, bloglar ve dokümantasyon
- Pazarlama ve kampanya sayfaları
- Ürün listeleri, kataloglar ve ilanlar
- SEO'nun gelir kalemi olduğu her sayfa
- Oturumlu dashboard ve kişiye özel paneller (private: true)
- Fragment ve bölge değişimiyle form odaklı arayüzler
Zayıf uyum
- Tam SPA kabukları ve istemci tarafı app router'lar
- Editör benzeri, işbirlikçi, durum ağırlıklı istemci ağaçları
- Streaming SSR veya React Server Components
- Gömülü gerçek zamanlı push (SSE, WebSocket veya polling size ait)
SSS
Sık sorulanlar
Neden React yok?
Sayfaların çoğu etkileşimli değil. React'in maliyeti sabit: runtime iner, ağaç kurulur, hidrasyon çalışır — ve sonuç sunucunun zaten ürettiği HTML'in aynısı olur. JSkelet o sabit maliyeti kaldırıp etkileşimi yalnızca ihtiyacı olan elementlere veriyor.
TypeScript kullanabilir miyim?
Framework kaynağı düz JavaScript + JSDoc ve jskelet import'ları için .d.ts yayınlar. Client entry ve island'lar .ts olabilir (esbuild tip siler; manifest anahtarı *.js kalır). Sunucu route, hook ve jskelet.config.mjs JavaScript kalır — orada jsconfig ile checkJs kullanın.
Cache süreç belleğinde: birden fazla instance'ta ne olur?
Her instance kendi L1 önbelleğini tutar, yani soğuk açılışta ısınma gerekir ve TTL sınırları kayabilir. Erken yenileme ve prewarm bu boşluğun çoğunu kapatır; isteğe bağlı Redis katmanı HTML'i paylaşır ve invalidateHtmlCache() / clearHtmlCache() çağrılarını pub/sub ile her kopyaya yayar. Nokta atışı geçersizleme her iki modelde de birinci sınıf.
Build çıktısı olmadan çalışır mı?
Evet. Manifest yoksa varlık yardımcısı hash'siz yollara döner ve layout stylesheet etiketini hiç basmaz. Build adımını atlamak hata değil, stilsiz ama çalışan bir sayfa verir.
Kalan sorular ve tam karşılık tablosu taşıma sayfasında.
İlk sayfanız beş dakikada hazır.
Tek komut, birlikte çalışan bir .jsk sayfa, bir bileşen ve bir island'dan oluşan bir iskelet kurar.