Możliwości wyświetlania grafiki w przeglądarkach internetowych

• Autorzy: Sołtysiuk Damian Piotr , Skublewska-Paszkowska Maria

Identyfikatory

DOI

10.35784/jcsi.2694

Warianty tytułu

EN

Graphics display capabilities in web browsers

• Języki publikacji: PL

Abstrakty

PL

Artykuł dotyczy wyświetlania grafiki w przeglądarkach internetowych. Można wyróżnić parę metod związanych z jej wyświetlaniem. Omawianymi metodami w tym artykule są: SVG, HTML5 Canvas oraz silnik graficzny WebGl. Badania wykonane zostały przy użyciu dedykowanej aplikacji webowej napisanej w Angularze oraz języku TypeScript wraz z pomocą biblioteki Two.js służącej do wyświetlania grafiki 2D. Dotyczyły przeanalizowania czasu renderowania i liczby klatek na sekundę elementów prostych i złożonych. Animacja badająca liczbę klatek na sekundę także miała dwa typy złożoności. Po przeanalizowaniu wszystkich wyników stwierdzono, że kierując się czasem renderowania elementów, najlepszą metodą jest HTML5 Canvas. Natomiast najlepszą metodą, osiągającą największą liczbę FPS przy animacji jest WebGl.

EN

The article discusses the issue of displaying graphics in web browsers. A couple of methods related to its display can be distinguished. The methods discussed are: SVG, HTML5 Canvas and the WebGl graphics engine. The research was done using a dedicated web application written in Angular and TypeScript language along with the help of Two.js library for displaying 2D graphics. It concerned the analysis of the rendering time and frame rate of simple and complex elements. The frame rate animation also had two types of complexity. After analyzing all the results it concluded that, guided by the rendering time of the elements, HTML5 Canvas turned out to be the best method. On the other hand, the best method which achieves the highest number of FPS for animation is WebGl.

Słowa kluczowe

PL

grafika; przeglądarka internetowa; silnik graficzny; porównanie

EN

graphics; web browser; graphics engine; comparison

• Wydawca: Wydawnictwo Politechniki Lubelskiej
• Czasopismo: Journal of Computer Sciences Institute
• Rocznik: 2021
• Tom: Vol. 20
• Strony: 237--242
• Opis fizyczny: Bibliogr. 7 poz., tab.

Twórcy

autor

Sołtysiuk Damian Piotr

• Department of Computer Science, Lublin University of Technology, Nadbystrzycka 36B, 20-618 Lublin, Poland

autor

Skublewska-Paszkowska Maria

• Department of Computer Science, Lublin University of Technology, Nadbystrzycka 36B, 20-618 Lublin, Poland

Bibliografia

• [1] Statystyki użycia różnych formatów zdjęć na stronach internetowych, https://w3techs.com/technologies/overv
• iew/image_format, [25.03.2021].
• [2] Statystyki użycia SVG na stronach internetowych, https://w3techs.com/technologies/details/im-svg, [25.03.2021].
• [3] D.E. Kee, L. Salowitz, R. Chang, Comparing Interactive Web-Based Visualization Rendering Techniques, VisWeek 2012 Poster Program, Washington, 2012.
• [4] T. Horak, U. Kister, R. Dachselt, Comparing Rendering Performance of Common Web Technologies for Large Graphs, Poster Program of the 2018 IEEE VIS Conference, Berlin, 2018.
• [5] A. Lindberg, Performance Evaluation of JavaScript Rendering Frameworks, Master thesis, Linköping University, Linköping, 2020, http://www.diva-portal.org/smash/get/diva2:1411632/FULLTEXT01.pdf, [25.03.2021].
• [6] K. Andrews, B. Wright, FluidDiagrams: Web-Based Information Visualisation using JavaScript and WebGl, Eurographics Conference on Visualization EuroVis (2014) 43-47.
• [7] D.W. Johnson, T.J. Jankun-Kelly, A Scalability Study of Web-Native Information Visualization, Proceedings of the Graphics Interface 2008 Conference (2008) 163–168.

Uwagi

Opracowanie rekordu ze środków MNiSW, umowa Nr 461252 w ramach programu "Społeczna odpowiedzialność nauki" - moduł: Popularyzacja nauki i promocja sportu (2021).