Transpiler
- Okunuşu
- trenspaylır
Kısaca
Transpiler, kaynak kodu bir dilden ya da dil sürümünden benzer soyutlama düzeyindeki bir başkasına, örneğin TypeScript'ten JavaScript'e çeviren araçtır.
Transpiler nedir?
Kaynak koddan kaynak koda derleyici (source-to-source compiler) anlamına gelen transpiler, bir dilde yazılmış kodu okur ve aşağı yukarı aynı soyutlama düzeyinde çalışan başka bir dilde eşdeğer kod üretir. Web geliştirmedeki en bilinen örnekler, TypeScript'i düz JavaScript'e derlemek ve modern JavaScript'i daha fazla tarayıcının anlayacağı eski bir sürüme dönüştürmektir.
Her derleyici gibi transpiler de kaynağı, kodun yapılandırılmış bir temsili olan soyut sözdizimi ağacına (AST) ayrıştırır, bu ağacı dönüştürür ve ondan yeni kaynak kod yazdırır. Babel, eklentiler aracılığıyla yeni söz dizimini ve JSX'i dönüştürür; esbuild, SWC ve TypeScript derleyicisi (tsc) gibi araçlar ise tip açıklamalarını ayıklar ve söz dizimini yeniden yazar; ilk ikisi Go ve Rust ile yazıldıkları için çok hızlıdır. Transpiler'lar ayrıca source map üretebilir; bunlar, üretilen çıktıda hata ayıklarken tarayıcı geliştirici araçlarının özgün kodunuzu göstermesini sağlar.
Transpiler, bir kitabı İngiliz İngilizcesinden Amerikan İngilizcesine çevirmek gibidir: anlam ve yapı aynı kalır, yalnızca ifade değişir. TypeScript'in ötesinde transpiler'lar Kotlin ve Dart gibi dilleri JavaScript'e derler, Sass'ı CSS'e dönüştürür. Tipik bir web projesinde transpiler bir bundler'ın ya da framework'ün derleme adımının içinde çalışır; bu yüzden onu nadiren doğrudan çağırırsınız.
Transpiler çoğunlukla derleyici ve polyfill ile karıştırılır. Geleneksel bir derleyici genellikle C'den makine koduna olduğu gibi daha düşük bir seviyeye çevirir, transpiler ise aynı seviyede kalır; transpile etmek aslında bir tür derlemedir, bu yüzden araçlar örtüşür. Transpiler yalnızca söz dizimini değiştirir ve Array.prototype.at gibi eksik çalışma zamanı fonksiyonlarını ekleyemez; bu polyfill'in işidir. Ayrıca TypeScript tiplerini ayıklamak onları denetlemekle aynı şey değildir: hızlı transpiler'lar tipleri tip denetimi yapmadan kaldırır, bu yüzden projeler tip hatalarını yakalamak için yine tsc --noEmit çalıştırır.
Önemli noktalar
- Transpiler, kaynak kodu benzer soyutlama düzeyindeki başka bir kaynak koda dönüştürür.
- Yaygın işleri: TypeScript'ten JavaScript'e, modern JavaScript'ten eski JavaScript'e ve JSX'ten fonksiyon çağrılarına.
- Kodu AST'ye ayrıştırır, ağacı dönüştürür ve yeni kodu yazdırır.
- Source map'ler, hata ayıklama için üretilen kodu özgün koda bağlar.
- Transpiler'lar söz dizimini yeniden yazar; polyfill'ler eksik çalışma zamanı özelliklerini ekler.
Örnek
// Input: TypeScript with types and optional chaining
interface User { name: string; address?: { city: string } }
const city = (user: User): string => user.address?.city ?? "unknown";
// Roughly what comes out when targeting older JavaScript (ES2019):
// const city = (user) => {
// var _a, _b;
// return (_b = (_a = user.address) === null || _a === void 0 ? void 0 : _a.city) !== null && _b !== void 0 ? _b : "unknown";
// };
// Typical commands:
// npx tsc --target es2019 src/city.ts
// npx esbuild src/city.ts --target=es2019 --outfile=dist/city.jsSık sorulan sorular
Transpiler ile derleyici arasındaki fark nedir?
Derleyici genellikle kodu makine kodu ya da bytecode gibi daha düşük seviyeli bir biçime çevirir. Transpiler ise TypeScript'ten JavaScript'e olduğu gibi benzer seviyedeki diller arasında çeviri yapar; özel bir tür derleyicidir.
Babel bir transpiler midir?
Evet. Babel, her dönüşüm için eklentiler kullanarak yeni söz dizimini ve JSX'i eski ortamların çalıştırabileceği koda dönüştüren bir JavaScript transpiler'ıdır.
TypeScript için transpiler'a ihtiyacım var mı?
Tarayıcılarda çalışan kod için evet; çünkü tarayıcılar TypeScript'i doğrudan çalıştıramaz. Node.js'in yeni sürümleri birçok TypeScript dosyasını tiplerini anında ayıklayarak çalıştırabilir ama yine de tip denetimi yapmaz.
Sık karşılaştırılanlar
İlgili sayfalar
- DerleyiciProgramlamanın Temelleri, s. 12Derleyici, bir programlama dilinde yazılmış kaynak kodu, bilgisayarın çalıştırabileceği makine kodu gibi daha alt seviyeli bir biçime çeviren programdır.
- TypeScriptWeb Geliştirme, s. 51TypeScript, JavaScript üzerine statik tipler ekleyerek birçok hatayı kod çalışmadan yakalayan ve düz JavaScript'e derlenen bir programlama dilidir.
- JavaScriptWeb Geliştirme, s. 25JavaScript, web tarayıcılarında sayfaları etkileşimli hale getiren ve Node.js gibi çalışma ortamlarıyla sunucularda da çalışan programlama dilidir.
- BundlerWeb Geliştirme, s. 4Bundler, JavaScript modüllerini ve bağımlılıklarını tarayıcıların hızlıca indirip çalıştırabileceği birkaç optimize dosyada birleştiren bir derleme aracıdır.
- PolyfillWeb Geliştirme, s. 34Polyfill, modern bir web özelliğini onu desteklemeyen eski tarayıcılara ekleyen koddur; böylece standart API her yerde özel durumlar olmadan kullanılabilir.
Bu sayfada bir hata ya da eksik mi gördünüz?Düzeltme önerin