3D sajt na mobilnom — kako da radi na slabim telefonima
3D sajt mora da radi i na 200-evrovom Samsung-u, ne samo na iPhone Pro-u — device-tier detekcija je obavezna.
Mobilna publika je 60-70% saobraćaja na većini sajtova, što znači da 3D sajt koji radi samo na flagship telefonima ne radi za većinu publike. Device-tier sistem koji koristim radi pre prve scene: detektuje GPU klasu kroz unmasked vendor info, RAM, broj logičkih jezgara, da klasifikuje uređaj u low/medium/high. Low tier vidi static fallback ili vrlo lagana scena (200 čestica, basic materijal); medium vidi srednju verziju (600 čestica, standardni materijal); high vidi punu kvalitetu. Korisnik nikada ne čeka na uređaj koji ne može da podrži. Lighthouse mobile na real devices testira se na Pixel 4a (low-end Android iz 2020) — to je pravi test, ne flagship u kancelariji.
Konkretan odgovor
Najkraći mogući odgovor na 3D sajt na mobilnom — kako da radi na slabim telefonima: za većinu projekata u 2026, ide se sa proverenim alatima i izbegava se eksperimentalan stack. Detalji zavise od opsega projekta, vremenskog horizonta i veličine tima. U narednim sekcijama ulazim u svaki od ovih faktora.
Šta utiče na izbor
Tri stvari koje određuju pravac: (1) lifespan projekta — sajt za 6-mesečnu kampanju ide drugačije od sajta koji treba da traje 5 godina, (2) tim koji održava — solo developer bira drugo nego agencija sa 10 ljudi, (3) device profil publike — premium publika ima moderne uređaje, mass market ima starije telefone.
Praktične preporuke
U produkcijskom radu sa mobilni, evo šta najčešće radim: stable Three.js (ne najnoviji rilis), glTF 2.0 + Draco za asete, KTX2 za teksture, IntersectionObserver da pauzira render kada scena nije vidljiva, prefers-reduced-motion respektovan svuda. To je 80% best-practice setup-a.
Najčešće greške
Tri greške koje viđam najviše: (1) test samo na flagship telefonu — uvek probati na 3-godina-starom Androidu sa 4GB RAM, (2) puni-rezolucija teksture na mobilnom — uvek imati KTX2 fallback, (3) scena renderuje i kad nije na ekranu — IntersectionObserver pauzira render loop. Svaki problem ima jasno rešenje, samo je važno prepoznati simptom.
Često postavljana pitanja
Mogu li sam da naučim ovo?
Šta posle ovog vodiča?
Koliko traje izrada?
Koliko košta?
Šta sa korisnicima na slabim telefonima?
Spremni za 3D iskustvo na vašem sajtu?
Recite mi šta vam treba — fiksna cena, fiksan rok, bez iznenađenja.