17.01.2012 01:14
5 rzeczy które zabijają płynność animacji we Flash'u
Na pewno każdy z nas słyszał chociaż raz, że Flash bywa powolny i choć z każdym wydaniem staje się coraz szybszy, wciąż można znaleźć gry Flash które mogą nadwyrężyć nawet najwydajniejszy komputer. O dziwo winna wcale nie musi leżeć po stronie programisty, lecz, zdawać by się mogło, niepozornych grafików - zgadza się, ActionScript (w szczególności 3) już jest na tyle szybki, że jego wpływ na działanie aplikacji może być nieporównywanie mniejszy w stosunku do wykorzystywanej grafiki. Dlatego pora dać odetchnąć programistom i zamiast tego raczej pomyśleć czy przez wypadek nie korzystamy z pięciu najbardziej wymagających elementów graficznych:
1. Filtry.
Niekwestionowany mistrz spowalniania Flash'a, wystarczy jeden niefortunnie położony filtr by zmienić naszą płynną animację w pokaz slajdów. Nie zagłębiając się w szczegóły, wykorzystanie dowolnego z filtrów na MovieClip'ie powoduje, że przestaje on być wyświetlany jako grafika wektorowa a staje się bitmapą - przy czym powodem spadku płynności nie jest sama bitmapa ale proces jej tworzenia, który dodatkowo wydłuża się geometrycznie wraz ze wzrostem rozmiaru grafiki. Dlatego korzystając z filtrów należy pamiętać przede wszystkim o dwóch rzeczach:
- unikać obszernych grafik (nie większe niż przeciętny banner na stronach WWW)
- unikać animowanych filtrów (z powodów o których pisze w następnym punkcie: "cache as bitmap")
2. Cache as bitmap (przechowuj jako bitmapę).
Bitmapy to dość intrygująca sprawa we Flash'u; weźmy na przykład zwykły czerwony kwadrat narysowany grafice wektorowej oraz w bitmapie - w tym wypadku Flash o wiele szybciej wyświetli ten w grafice wektorowej niż w bitmapie. Jeśli jednak owy kwadrat zostanie wypełniony różnymi detalami, wzorkami lub gradientami, szybko może okazać się, że bitmapa będzie o wiele łatwiejsza do wyświetlania. Gdzie leży granica? Cóż, jest to coś, co wymaga doświadczenia zabranego na własną rękę, jednak w większości przypadków już samo dodanie gradientów jest dobrym powodem by przejść na "cache as bitmap". Niestety, nie ma róży bez kolców... bo o ile wyświetlanie bitmapy może być często szybsze to już wykorzystanie jakiejkolwiek transformacji (zmiana kolor, skalowanie, rotacja) może mięć zaskakująco tragiczne skutki. Tak więc z bitmapami należy obchodzić się ostrożnie i pamiętać:
- cache as bitmap jest kompletnie bezużyteczny na animowanym MovieClip'ie.
- cache'owane MovieClip'y i bitmapy są bardzo powolne przy wszelakich transformacjach.
- jeśli już musisz lepiej jest transformować prawdziwą bitmapę niż MovieClip z "cache as bitmap".
3. Alpha (przeźroczystość).
Tak wiem, "zrezygnować z przeźroczystości? Nie ma mowy!" Jednak nie bez powodu alpha zajmuje 3 miejsce na tej liście - ten cichy zabójca zwiększa dwukrotnie czas potrzebny na wyświetlanie pikseli na ekranie. Więc jeśli tylko możesz, zamiast znowu tworzyć cień półprzeźroczystym czarnym kształtem, poświeć trochę więcej czasu i naprawdę przyciemnij te kolory na ziemi.
4. Nadmiar MovieClip'ów.
Bardzo łatwo można się przyzwyczaić do wygody jaką dają MovieClip'y, w końcu tak łatwo możne je podmienić, edytować nie wpływając na inne obiekty i co najważniejsze zduplikować wielokrotnie by wypełnić scenę szczegółami. Oczywiście za tą wygodą kryję się pewna cena, cena wydajności. Każdy MovieClip na scenie to nie tylko dodatkowa grafika ale także cała masa parametrów: pozycja, skala, filtry, kolory, nazwa, widoczność, cache'owanie itd. i nawet jeśli z nich nie korzystasz to one wciąż są brane pod uwagę na nowo w każdej klatce animacji. Dlatego gdzie jest to tylko możliwe zamień swoje MovieClip'y na obiekty Grafiki (choć najwydajniejszy zawsze będzie zwyczajny obiektu Kształtu).
5. Ukryte elementy.
Czyli wszystko to czego nie widzimy, ale wciąż tam jest. Najgorsza w tym wypadku jest maska, bo mimo że przykrywa jakiś element to on wcale nie przestaje istnieć, wręcz przeciwnie, z punktu widzenia Flash'a cała grafika zasłonięta przez maskę wciąż jest wyrysowywane na ekranie, tylko potem, po wszystkim przycinane do wyznaczonych granic. Podobnie jest z obszarem wyświetlania Flash'a, on również niczego nie usuwa - każdy element na scenie, nie ważne czy jest poza czy na ekranie, wciąż ma taki sam wpływ na wydajność.
1. Filtry.
Niekwestionowany mistrz spowalniania Flash'a, wystarczy jeden niefortunnie położony filtr by zmienić naszą płynną animację w pokaz slajdów. Nie zagłębiając się w szczegóły, wykorzystanie dowolnego z filtrów na MovieClip'ie powoduje, że przestaje on być wyświetlany jako grafika wektorowa a staje się bitmapą - przy czym powodem spadku płynności nie jest sama bitmapa ale proces jej tworzenia, który dodatkowo wydłuża się geometrycznie wraz ze wzrostem rozmiaru grafiki. Dlatego korzystając z filtrów należy pamiętać przede wszystkim o dwóch rzeczach:
- unikać obszernych grafik (nie większe niż przeciętny banner na stronach WWW)
- unikać animowanych filtrów (z powodów o których pisze w następnym punkcie: "cache as bitmap")
2. Cache as bitmap (przechowuj jako bitmapę).
Bitmapy to dość intrygująca sprawa we Flash'u; weźmy na przykład zwykły czerwony kwadrat narysowany grafice wektorowej oraz w bitmapie - w tym wypadku Flash o wiele szybciej wyświetli ten w grafice wektorowej niż w bitmapie. Jeśli jednak owy kwadrat zostanie wypełniony różnymi detalami, wzorkami lub gradientami, szybko może okazać się, że bitmapa będzie o wiele łatwiejsza do wyświetlania. Gdzie leży granica? Cóż, jest to coś, co wymaga doświadczenia zabranego na własną rękę, jednak w większości przypadków już samo dodanie gradientów jest dobrym powodem by przejść na "cache as bitmap". Niestety, nie ma róży bez kolców... bo o ile wyświetlanie bitmapy może być często szybsze to już wykorzystanie jakiejkolwiek transformacji (zmiana kolor, skalowanie, rotacja) może mięć zaskakująco tragiczne skutki. Tak więc z bitmapami należy obchodzić się ostrożnie i pamiętać:
- cache as bitmap jest kompletnie bezużyteczny na animowanym MovieClip'ie.
- cache'owane MovieClip'y i bitmapy są bardzo powolne przy wszelakich transformacjach.
- jeśli już musisz lepiej jest transformować prawdziwą bitmapę niż MovieClip z "cache as bitmap".
3. Alpha (przeźroczystość).
Tak wiem, "zrezygnować z przeźroczystości? Nie ma mowy!" Jednak nie bez powodu alpha zajmuje 3 miejsce na tej liście - ten cichy zabójca zwiększa dwukrotnie czas potrzebny na wyświetlanie pikseli na ekranie. Więc jeśli tylko możesz, zamiast znowu tworzyć cień półprzeźroczystym czarnym kształtem, poświeć trochę więcej czasu i naprawdę przyciemnij te kolory na ziemi.
4. Nadmiar MovieClip'ów.
Bardzo łatwo można się przyzwyczaić do wygody jaką dają MovieClip'y, w końcu tak łatwo możne je podmienić, edytować nie wpływając na inne obiekty i co najważniejsze zduplikować wielokrotnie by wypełnić scenę szczegółami. Oczywiście za tą wygodą kryję się pewna cena, cena wydajności. Każdy MovieClip na scenie to nie tylko dodatkowa grafika ale także cała masa parametrów: pozycja, skala, filtry, kolory, nazwa, widoczność, cache'owanie itd. i nawet jeśli z nich nie korzystasz to one wciąż są brane pod uwagę na nowo w każdej klatce animacji. Dlatego gdzie jest to tylko możliwe zamień swoje MovieClip'y na obiekty Grafiki (choć najwydajniejszy zawsze będzie zwyczajny obiektu Kształtu).
5. Ukryte elementy.
Czyli wszystko to czego nie widzimy, ale wciąż tam jest. Najgorsza w tym wypadku jest maska, bo mimo że przykrywa jakiś element to on wcale nie przestaje istnieć, wręcz przeciwnie, z punktu widzenia Flash'a cała grafika zasłonięta przez maskę wciąż jest wyrysowywane na ekranie, tylko potem, po wszystkim przycinane do wyznaczonych granic. Podobnie jest z obszarem wyświetlania Flash'a, on również niczego nie usuwa - każdy element na scenie, nie ważne czy jest poza czy na ekranie, wciąż ma taki sam wpływ na wydajność.