„Az összevisszaságban találd meg az egyszerűséget, a hangzavarban a harmóniát...”

javaScript minifikációs tippek

A js1k.com versenyén való részvétel kapcsán írom most le a tapasztalataimat. Először is, minden fejlődni vágyó programozónak csak ajánlani tudom az ilyen jellegű kihívásokat. A dolog lényege az, hogy meghatározott méretbeli limitet és a szabályokat betartva kell valami maradandót alkotni. A compo nevéből adódóan jelen esetben a méretbeli határ 1 kbyte volt. Kikötés volt még, hogy mely böngészőkben kell futnia hiba nélkül, illetve a javasolt téma a tavasz volt.

Ha ilyen megmérettetésre adjuk a fejünket, a nulladik, legfontosabb lépés az, hogy legyen egy jó ötletünk. Lehetünk akármilyen rafinált programozók, ha a végtermék nem "üt", akkor az érmekért folyó harcba nem tudunk beleszólni. Az én alkotásom egy tavaszias környezetben tálalt Pac-Man átirat volt.

Ha az ötlet adott, el is kezdhetjük leprogramozni. A leginkább mellbevágó annak megtapasztalása lesz, hogy mennyire kevés az 1k. Beírsz pár változót, esetleg egy pár ciklust, és már át is lépted a limitet. Ez rákényszerít arra, hogy az eddig rutinból írt szokásos algoritmusokba picit jobban belegondolj. Gyakori, hogy az egy-egy bájtért folytatott harcban szándékosan kell hibát véteni a kódban. Bőven elég az, ha az algoritmus csak az adott esetben működik megfelelően. Hibakezelésnek, szélsőérték vizsgálatoknak - mondanom sem kell -, helye nincs (szó szerint!).

Teletömött szekrény hasonlatÚgy kell ezt elképzelni, mint amikor a rajzfilmekben a teletömött szekrény ajtaját tartó figura ellép onnan, és abban a pillanatban kizúdul minden kacat a szekrényből. Itt is bőven elég ha csak akkor, csak addig és csak arra működik amire épp kell, miden más esetben nyugodtan kiütközhetnek a hibák. A jó kód ronda lesz, átláthatatlan, és hibákkal teli. És most még a tömörítetlen változatról beszélek! Ha ez megvan, akkor jöhet a második fázis, a tömörítés. Ennek lényege az, hogy a kódot egy tömörítő eljárás segítségével összecsomagoljuk még kisebbre. Ekkor egy teljesen kusza karakterhalmazt kapunk, ami önmagában működésképtelen. A végső 1k-s kódnak tehát tartalmaznia kell ezt a betömörített adatot sztringként, valamint magát a kitömörítő programot is, ami visszaalakítja a kódot, és lefuttatja azt.

Lehet hogy elsőre bonyolultnak hangzik, de az alábbi kódot megvizsgálva szerintem könnyen megérthető:

javaScript demó kód
Így már minden világos: a piros az adat, a kék a kitömörítő

Ez a kód teljesen valid javaScript kód. Látható hogy az oroszlánrészét az eredeti minifikált kód tömörített változata teszi ki, ami egy sztringben van tárolva (piros). Ezt követi az ezt kicsomagoló alkalmazás (kék), majd végül a kicsomagolt adat futtatása eval()-lal.

Így már remélem érthető, hogy kódolás közben miért kell olykor fölösleget, redundanciát és különböző hibákat, de viselkedést nem befolyásoló kódrészleteket is írni a kódba: azért, mert a tömörítő program nyilván annál jobb hatékonysági fokkal tud dolgozni, minél több és minél hosszabb azonos részleteket talál. Sok esetben úgy nyertem pár bájtot, hogy egy mintát észrevéve, hozzáírtam még valamit a kódhoz. Az is nyilvánvaló, hogy csak akkor éri meg tömöríteni, ha a kitömörítő programmal együtt is kisebb lesz a mérete, mint az eredeti tömörítetlen. Tömörítő programnak ajánlom ezt a crusher-t.

Jó tanács: amikor azt mondod, hogy a kódodat már lehetetlen tovább egyszerűsíteni, akkor még lehet. Mikor már ötvenedszer mondod ezt, akkor rájössz, hogy eddig 49-szer nem volt igazad, és tudod, hogy akkor nyilván ötvenedszerre sincs.