2015-10-06 32 views
5

Zamierzam mieć płótno FabricJS, które wyświetli potencjalnie dziesiątki różnych grafik, które mogą być wyświetlane jako pojedyncze pliki graficzne lub ikonka. Dla każdej grafiki możliwe jest, że konkretna grafika będzie wyświetlana na płótnie od 0 do dziesiątek razy. Wiem, że FabricJS ma zdolność clipping, która umożliwiłaby użycie ikonek i wiem, że ogólnie rzecz biorąc, sprite w sieci są bardzo preferowane w stosunku do pojedynczych obrazów, na przykład do CSS.Wydajność Fabric.js Sprite Sprite vs Pojedyncze obrazy

Jednak słyszałem również o zachowaniach przeglądarki/dziwactwach otaczających płótno, w których pewne optymalizacje mogą się spodziewać, nie - nie mogę znaleźć w tej chwili linku, ale który przywołuję było to, jak duże elementy treści na widoku poza przeglądarką Chrome zajmowałyby znaczną część czasu, aby można było je obliczyć/"wyrenderować", mimo że nie były istotne dla wyglądu na ekranie.

Więc, czy są jakieś znane oczekiwania dotyczące tego, czy n indywidualne non-Obcięte obrazy byłyby korzystniejsze/unpreferable do ikonki, która jest przycięty n razy na płótnie FabricJS? Jeśli to ma znaczenie, nie byłoby to mocno animowane płótno FabricJS; rzeczy mogą się poruszać po przeciągnięciu, ale ciągła animacja nie jest tym, co jest zaangażowane w tę sprawę.

+0

Według http://caniuse.com/#feat=canvas nie ma żadnych problemów związanych (patrz strzyżenia znane problemy patka). Powiedział, że powinieneś wybrać trzy najlepsze platformy (chrome, ios i .... android, powiedzmy ...) i wykonać podstawowe testy wydajności. – dsummersl

+1

@dsummersl Co ciekawe, caniuse.com wspomina o problemie z obcinaniem w systemie Android; raport o błędzie, do którego prowadzi łącze, jest zamknięty jako przestarzały bez wyraźnej rozdzielczości. – jmq

+0

o tak, prawda ... czytanie biletu, który brzmi, jakby był prawdopodobnie problemem dla 1/3 przeglądarek dla Androida (total rough guestimate from http://developer.android.com/about/dashboards/index.html). – dsummersl

Odpowiedz

0

Po prostu wykonaj test samodzielnie, aby dowiedzieć się, co spowalnia komputer. Zależy to od komputera, przeglądarki i karty graficznej.

Nie wiem nic o Fabric.js, ale procesory komputerowe i karty graficzne mogą z łatwością obsługiwać obcinanie/manipulowanie grafiką. Nie wyświetlasz milionów wielokątów, takich jak gra 3D, więc powinieneś mieć się dobrze.

Oto strona, która wyjaśnia CSS sprites vs pojedynczych obrazów zwiększa wydajność sieci: https://medium.com/parlay-engineering/emoji-at-scale-render-performance-of-css-sprites-vs-individual-images-f0a0a2dd8039

+0

Dzięki, ale ta odpowiedź nie zadawala pytania. Jeśli zajdzie taka potrzeba, mogę napisać własne testy, tak, ale poprosiłem o SO w przypadku, gdy istnieje jakaś wystarczająca wiedza, którą ktoś mógłby podzielić się z wcześniejszych doświadczeń lub testów. Jeśli chodzi o liczbę kształtów, zauważalna jest różnica w moim doświadczeniu w pracy z płótnem Fabric.js i wysokimi setkami lub niskimi tysiącami elementów, więc fakt, że nie robiłbym milionów kształtów, nie jest wystarczającym pocieszeniem, że sprite są droga do przebycia. – jmq