Babylon.js 8.0 kao most između WebGL‑a i WebGPU‑a
Babylon.js 8.0 pozicionira se kao jedan od najzrelijih 3D enginea za web. Nova verzija ne odbacuje WebGL, nego ga nadograđuje i priprema za svijet u kojem WebGPU postaje novi baseline. U praksi, većina ozbiljnih produkcijskih projekata i dalje cilja WebGL 2 radi široke kompatibilnosti, stabilnosti drivera i predvidljivih performansi. Babylon 8.0 upravo u tom prostoru donosi najveću vrijednost.
Ključne novosti – Node Render Graph, dvostruki skup core shadera u GLSL‑u i WGSL‑u te Lightweight Viewer – mijenjaju način na koji se WebGL koristi u stvarnim aplikacijama. Umjesto klasičnog „game engine” pristupa, fokus je na kontroliranom render pipelineu, čistim shaderima i manjim bundleovima za web scenarije poput konfiguratora proizvoda, edukativnih vizualizacija ili B2B portala.
Node Render Graph: od „black box” pipelinea do vizualne kontrole
Najveća promjena za WebGL developere je uvođenje Node Render Grapha. Do sada je tipičan WebGL workflow u frameworku bio poluzatvoren: engine interno vodi brigu o redoslijedu render passova, a developer intervenira kroz hookove, post‑processing chain ili ručne izmjene render loopa.
Node Render Graph razbija taj „black box”. Render pipeline postaje graf čvorova koji predstavljaju pojedine korake: geometrijski pass, shadow map generiranje, post‑processing efekte, UI sloj, SSR ili volumetrijsko osvjetljenje. Svaki čvor ima ulaze i izlaze, a developer može vizualno ili programatski presložiti tok podataka.
Što to znači u stvarnim WebGL projektima
U produkciji se rijetko radi samo o jednoj sceni i jednom kamerom. Primjeri:
- Konfigurator proizvoda: jedan pass za glavni model, drugi za refleksije, treći za UI overlay, poseban pass za „ghosted” prikaz unutarnjih komponenti.
- Digitalna tvornica: zasebni passovi za statičnu arhitekturu, dinamične strojeve, highlight senzora i alarmne slojeve koji se renderiraju drugačijim shaderima.
- Urbanističke vizualizacije: kombinacija depth‑prepassa za zgrade, posebnog renderiranja za promet, te naknadnih efekata magle i atmosfere.
Bez Node Render Grapha, takvi scenariji često završavaju u ručno pisanom render loopu punom uvjeta, custom frame buffer objekata i ad‑hoc post‑processing lanca. S Node Render Graphom, isti se workflow deklarativno modelira kao graf. Tim dobiva:
- preciznu kontrolu nad redoslijedom GPU operacija,
- lakše debugiranje pojedinih passova,
- mogućnost ponovne upotrebe podgrafova između projekata,
- jasniji utjecaj pojedinog pasa na FPS i frame pacing.
Za WebGL, gdje je svaka milisekunda renderiranja bitna, ovakva transparentnost pipelinea je ključna. Lakše je izolirati skupe efekte, optimizirati render targete i smanjiti broj draw callova po passu.
GLSL i WGSL core shaderi: čišći kod i hibridni materijali
Druga velika novost je dvostruki skup core shadera: svaki ključni shader sada postoji u GLSL i WGSL varijanti. Formalno, razlog je podrška za WebGPU, ali posljedice za WebGL su vrlo konkretne.
Da bi engine održavao dva jezika, Babylon tim je morao:
- modularizirati shader kod u manje, jasno definirane dijelove,
- standardizirati nazive uniformi, atributa i buffer layouta,
- očistiti povijesne „ifdef” grane i eksperimentalne blokove,
- uspostaviti zajedničku logiku za PBR, osvjetljenje, shadowing i post‑processing.
Rezultat je čišći i predvidljiviji shader ekosustav. Za WebGL developera to znači da je lakše razumjeti što se događa u shaderima, nadograditi postojeće materijale i pisati vlastite varijante bez da se razbije cijeli pipeline.
Praktični učinci na izradu materijala
U tipičnom WebGL projektu danas se traži kombinacija:
- standardnog PBR materijala za većinu objekata,
- specijaliziranih materijala za staklo, metal, zaslone ili holograme,
- tehničkih shader efekata za isticanje dijelova modela (outline, pulsiranje, heatmap).
Prije modularizacije, svaki takav materijal lako je završio kao „shader spaghetti” – gomila uvjeta, dupliciranog koda i teško prenosivih trikova. U Babylon.js 8.0, core logika osvjetljenja i BRDF‑ova postoji u obje varijante jezika i može se dijeliti između WebGL i WebGPU backendova.
To otvara prostor za hibridne materijale: jedan izvorni koncept materijala koji ima konzistentno ponašanje na WebGL‑u danas i WebGPU‑u sutra. Timovi mogu investirati u kvalitetne shader module znajući da ih neće morati potpuno prepisivati kada klijenti ili proizvodi počnu tražiti WebGPU kao primarni API.
Lightweight Viewer: WebGL integracija bez „teškog” enginea
Treći ključni element Babylon.js 8.0 za WebGL praksu je Lightweight Viewer. On koristi isti rendering engine, ali u znatno manjem paketu, uz dinamičko učitavanje mogućnosti ovisno o modelu i sceni.
Za mnoge web projekte WebGL nije srž aplikacije, nego dodatni sloj vizualizacije. Primjeri:
- e‑commerce stranica koja prikazuje 3D modele proizvoda,
- edukativna platforma koja koristi 3D anatomiju ili strojeve,
- korporativni portal s nekoliko interaktivnih 3D dijagrama.
U takvim slučajevima puni game engine je pretjeran. Bitno je da:
- inicijalni bundle ostane mali,
- prvo učitavanje stranice bude brzo,
- WebGL se aktivira tek kad korisnik doista treba 3D prikaz.
Lightweight Viewer upravo to omogućuje. Funkcionira kao lagani gateway prema istom render pipelineu: osnovne funkcije za učitavanje glTF/GLB modela, osnovno osvjetljenje, kontrole kamere i minimalan UI. Naprednije mogućnosti – kompleksni post‑processing, fizika, napredni materijali – učitavaju se samo ako ih scena doista koristi.
Primjeri integracije u postojećim web aplikacijama
U praksi, WebGL se često integrira u postojeće SPA ili CMS sustave. Lightweight Viewer omogućuje scenarije poput:
- „Embed” 3D pogleda u članku: CMS učitava lagani Babylon paket, a stvarni engine featurei se dinamički dodaju samo za članke s 3D sadržajem.
- B2B konfiguratori: osnovni prikaz proizvoda koristi minimalni set shader funkcija, dok se napredni efekti (npr. realistične refleksije, AO, bloom) učitavaju tek u „expert” modu.
- Dashboardi s 3D widgetima: 3D prikaz je tek jedan od widgeta; Lightweight Viewer sprječava da 3D dio pojede većinu JS budžeta.
Za WebGL ekosustav ovo je važan pomak: 3D prestaje biti monolitni blok koda i postaje prilagodljivi modul koji se uklapa u standardne web performansne ciljeve.
WebGPU je tu, ali WebGL ostaje produkcijski standard
WebGPU je danas dostupan u svim glavnim preglednicima, no realna slika produkcije je drugačija. Mnogo je razloga zašto WebGL 2 ostaje glavni target:
- dugogodišnja provjera u produkciji,
- poznati driver bugovi i workaroundi,
- šira podrška na starijim uređajima,
- postojanje alata i pipelineova izgrađenih oko WebGL‑a.
Babylon.js 8.0 prihvaća tu realnost. Umjesto da forsira „čisti” WebGPU, engine gradi hibridni model: WebGL kao stabilan i pouzdan sloj, WebGPU kao napredni backend koji koristi iste koncepte shadera, materijala i render grapha.
To znači da se današnje arhitektonske odluke ne svode na „WebGL ili WebGPU”, već na izbor enginea i strukture koda. Ako se projekt oslanja na engine koji već sada:
- održava GLSL i WGSL varijante shadera,
- ima render pipeline definiran kao graf,
- podržava lightweight i full‑feature načine rada,
onda je tranzicija na WebGPU u budućnosti više operativno pitanje nego potpuni re‑write.
Što ovo znači za timove koji danas planiraju projekte
Za razvojne timove i tehničke voditelje poruka Babylon.js 8.0 izdanja je jasna: ulaganje u dobro strukturiran WebGL kod i dalje je dugoročno isplativo, pod uvjetom da se koristi engine koji aktivno gradi most prema WebGPU‑u.
Praktične smjernice:
- Planirajte render pipeline kao graf: čak i ako danas ne koristite sve mogućnosti Node Render Grapha, razmišljajte u terminima passova, resursa i njihovih odnosa.
- Standardizirajte materijale: gradite biblioteke PBR i specijaliziranih materijala koje se oslanjaju na core logiku enginea, umjesto na jednokratne „hackove”.
- Odvajajte „viewer” i „engine” sloj: za jednostavne integracije koristite lightweight pristup, a puni engine ostavite za kompleksne aplikacije.
- Pratite WebGPU, ali ne blokirajte se: arhitekturu gradite tako da danas radi optimalno na WebGL‑u, uz minimalne prepreke za budući WebGPU backend.
U tom kontekstu, Babylon.js 8.0 nije samo još jedno izdanje s novim efektima, već signal smjera u kojem se kreće cijeli 3D web. WebGL ostaje temelj, ali alati oko njega postaju sve sličniji modernim grafičkim engineima iz svijeta natvnih aplikacija – s jasnim pipelineom, modularnim shaderima i fleksibilnim viewer slojem.
