2015-07-17 15 views
5

Stworzyłem grę karcianą za pomocą HTML/CSS/JS. Porusza się animuje karty wokół ekranu i animuje tablicę wyników/tablicę ogłoszeń.Optymalizacja wydajności GPU HTML5/CSS

Wydajność na moim chromecastzie jest jednak straszna. Czasami pogarsza się do 4 klatek na sekundę :(. Kiedy debuguję aplikację, używam 20 MB/512 MB procesora graficznego Zastanawiam się, czy istnieje jakikolwiek sposób na rasteryzację GPU lub jakiekolwiek inne zaawansowane funkcje GPU, lub jeśli ktoś ma jakieś wskazówki jak Aby poprawić wydajność gry

Do tej pory usuwałem tekstury, przezroczystość i upraszczanie animacji.By chciałbym uzyskać porady, jak uzyskać więcej wydajności z chromecastu.Zdaję sobie sprawę, że WebGL będzie prawdopodobnie pozwoli mi większe wykorzystanie GPU, ale to byłoby przepisanie moich zajęciach animacyjnych.

+0

Używaj Animacje CSS, gdzie to możliwe, zamiast polegać na javascript, aby animować wszystko. Generalnie uzyskasz lepszą wydajność dzięki animacjom CSS niż w przypadku animacji JS. Bez konkretnego kodu nie mogę jednak naprawdę pomóc innym niż udzielać szerokiej porady. – kanzelm3

+0

IMHO najlepszym sposobem na stworzenie gry html5 jest użycie WebGL. –

+0

Jeśli rysujesz na płótnie, zdecydowanie używaj WebGL, kiedy tylko możesz. Jeśli manipulujesz DOM, staraj się trzymać animacji CSS3, są one zwykle przyspieszane sprzętowo i wysoce zoptymalizowane. –

Odpowiedz

1

Sztuką było zmuszenie mojej biblioteki javascript animacja animować moje 2d animacje jak 3d zatem wykorzystanie GPU.