HTML Canvas & CreateJS
Szervusztok!
Készülőben egy oldal melynek a feladata adobe animateben készült és html casnvasba kimentett effektek megjelenítése volna.
A rendszer adott, működik, mivel az oldalt újratöltögetni nem akarom így egy divbe betöltöm a html canvast a hozzá tartozó js-t, és egy menüben navigálva tudok váltogatni ezek között.
Viszont egy érdekességre lettem figyelmes miszerint ha egymás után többször töltök be egyet vagy akár egyszer egyszer de különbözőeket akkor fogja magát és az oldal elkezd laggolni, értem ezalatt hogy minden animációs jellegű tényező belaggol (menü hover animációi) illetve maga a megjelenő effect is irtózatosan elkezd laggolni.
Persze ez lépcsőztessen történik, minél többet töltök be annál inkább leterheli az oldalt.
Gondolnám egyszerű paraszti logikával, hogy mivel lineárisan kezdem el leterhelni az oldalt a különböző effektek betöltésévél, valamit amit nem kéne telegyömöszölök olyan információkkal ami az új effekt betöltésékőr már nem is kell.
Nos én alap esetben azt gondolnám, hogy ha egy divbe töltöttem be a canvast és az újat is ebbe, ami ugye kilöki a másikat (vagy legalább is nem látni már), akkor annak a kódja máááár nem él. Ellenben gyanítom hogy itt én valamit jócskán félregondolok és valahol a háttérbe amit nem látok a js még dolgozik (js alatt a https://code.createjs.com/createjs-2015.11.26.min.js-re gondolok ami ugye életre kelti a betöltött forrás js-ét az animációnak).
Ááámbár a megfogalmazásom kissé kusza lehet remélem azért még is van aki egy kicsit feltud világosítani, hogy még is mit tehetnék a probléma kiküszöbölése érdekében.
Megtisztelő válaszotokat előre is köszönöm!
Szerkesztve:
Még egy kis kiegészítés az egészhez hát ha így érthetőbb lesz egy picit.
Az oldal mint olyan létezett csak eddig google swiffys anyagok betöltésére szolgált hasonló módon. Ott bizony nem volt ilyen jellegű gond.
Viszont ott maga az effect forrásanyaga is jóval primitívebb, egyszerűbb volt.
swiffyobject = effectforráskód;
Köszönöm türelmetek és megtisztelő válaszaitok.
Szerkesztés 2.:
Google Chromeba a kódszerkesztő részben kiszedtem mindent, minden rávonatkozó js kódrészt, egyedül a canvas rész marad bent és ami furcsa, hogy az animáció fut tovább.
Merül fel bennem a kérdés, hogy az effect mozgató motorja nélkül ami ugye a createjs... hogy tud még is mozogni ._., valami tényleg a háttérben dolgozik.
■ Készülőben egy oldal melynek a feladata adobe animateben készült és html casnvasba kimentett effektek megjelenítése volna.
A rendszer adott, működik, mivel az oldalt újratöltögetni nem akarom így egy divbe betöltöm a html canvast a hozzá tartozó js-t, és egy menüben navigálva tudok váltogatni ezek között.
Viszont egy érdekességre lettem figyelmes miszerint ha egymás után többször töltök be egyet vagy akár egyszer egyszer de különbözőeket akkor fogja magát és az oldal elkezd laggolni, értem ezalatt hogy minden animációs jellegű tényező belaggol (menü hover animációi) illetve maga a megjelenő effect is irtózatosan elkezd laggolni.
Persze ez lépcsőztessen történik, minél többet töltök be annál inkább leterheli az oldalt.
Gondolnám egyszerű paraszti logikával, hogy mivel lineárisan kezdem el leterhelni az oldalt a különböző effektek betöltésévél, valamit amit nem kéne telegyömöszölök olyan információkkal ami az új effekt betöltésékőr már nem is kell.
Nos én alap esetben azt gondolnám, hogy ha egy divbe töltöttem be a canvast és az újat is ebbe, ami ugye kilöki a másikat (vagy legalább is nem látni már), akkor annak a kódja máááár nem él. Ellenben gyanítom hogy itt én valamit jócskán félregondolok és valahol a háttérbe amit nem látok a js még dolgozik (js alatt a https://code.createjs.com/createjs-2015.11.26.min.js-re gondolok ami ugye életre kelti a betöltött forrás js-ét az animációnak).
Ááámbár a megfogalmazásom kissé kusza lehet remélem azért még is van aki egy kicsit feltud világosítani, hogy még is mit tehetnék a probléma kiküszöbölése érdekében.
Megtisztelő válaszotokat előre is köszönöm!
Szerkesztve:
Még egy kis kiegészítés az egészhez hát ha így érthetőbb lesz egy picit.
Az oldal mint olyan létezett csak eddig google swiffys anyagok betöltésére szolgált hasonló módon. Ott bizony nem volt ilyen jellegű gond.
Viszont ott maga az effect forrásanyaga is jóval primitívebb, egyszerűbb volt.
swiffyobject = effectforráskód;
Köszönöm türelmetek és megtisztelő válaszaitok.
Szerkesztés 2.:
Google Chromeba a kódszerkesztő részben kiszedtem mindent, minden rávonatkozó js kódrészt, egyedül a canvas rész marad bent és ami furcsa, hogy az animáció fut tovább.
Merül fel bennem a kérdés, hogy az effect mozgató motorja nélkül ami ugye a createjs... hogy tud még is mozogni ._., valami tényleg a háttérben dolgozik.
Problem Solved
Aki hasonló jellegű problémával találkozna annak a
stage.removeAllChildren();
stage.update();
parancsok fognak segíteni.