Cited By
View all- Stucki SAckermann P(2024)Physically-based Path Tracer using WebGPU and OpenPBRProceedings of the 29th International ACM Conference on 3D Web Technology10.1145/3665318.3677158(1-6)Online publication date: 25-Sep-2024
FusionRender: Harnessing WebGPU's Power for Enhanced Graphics Performance on Web Browsers
Authors: 
Weichen Bi, Yun Ma, 
Yudong Han, Yifan Chen, Deyu Tian, Jiaqi DuAuthors Info & Claims
Pages 2890 - 2901
Abstract
Graphics rendering on web browsers serves as the foundation for numerous web applications. Compared with the widely employed WebGL, the next-generation web graphics API, WebGPU, demonstrates an enhanced capacity to adapt to modern GPU features, boasting more significant potential. However, our experiment shows that the performance of current graphics rendering frameworks based on WebGPU lags behind those built on WebGL. Such discrepancy primarily arises from an incomplete alignment with WebGPU's distinctive features. The individual rendering of each graphic leads to redundant communication between the CPU and GPU. To enhance the graphics performance on the web, we introduce the FusionRender to harness the power of WebGPU. To mitigate redundant communication, FusionRender assigns a unique signature to each object and employs these signatures for grouping, enabling the consolidation of graphics rendering whenever possible. In simulated experiments involving the rendering of multiple objects, FusionRender improves the rendering performance by 29.3%-122.1% compared with the existing optimal baseline. In real cases with more complex features, performance improvement ranges from 9.4% to 39.7%. Additionally, FusionRender exhibits robust performance enhancement across various devices and browsers.
Supplemental Material
MP4 File
presentation video
- Download
- 1223.91 MB
MP4 File
Supplemental video
- Download
- 22.13 MB
References
[1]
Apple. 2023a. Developer forums topic about safari support for WebGPU. https://developer.apple.com/forums/thread/692979
[2]
Apple. 2023b. Metal. https://developer.apple.com/metal/
[3]
Apple. 2023c. WebKit. https://webkit.org/
[4]
Vasco Asturiano. 2023. 3d-force-graph. https://github.com/vasturiano/3d-force-graph/tree/master
[5]
Babylon.js. 2023. Babylon.js. https://github.com/BabylonJS
[6]
Hussein Bakri. 2019. Adaptivity of 3D web content in web-based virtual museums: a quality of service and quality of experience perspective. Ph.,D. Dissertation. University of St Andrews.
[7]
Alexander E Beasley, Christopher T Clarke, and Robert J Watson. 2020. An OpenGL compliant hardware implementation of a graphic processing unit using field programmable gate array--system on chip technology. ACM Transactions on Reconfigurable Technology and Systems (TRETS), Vol. 14, 1 (2020), 1--24.
[8]
François Beaufort and Corentin Wallez. 2023. Chrome ships WebGPU. https://developer.chrome.com/blog/webgpu-release/
[9]
Weichen Bi, Yun Ma, Deyu Tian, Qi Yang, Mingtao Zhang, and Xiang Jing. 2023. Demystifying Mobile Extended Reality in Web Browsers: How Far Can We Go?. In Proceedings of the ACM Web Conference 2023. 2960--2969.
[10]
Kevin C Cassidy, Jan vS efvc 'ik, Yogindra Raghav, Alexander Chang, and Jacob D Durrant. 2020. ProteinVR: Web-based molecular visualization in virtual reality. PLoS computational biology, Vol. 16, 3 (2020), e1007747.
[11]
Alban Denoyel, Cédric Pinson, and Pierre-Antoine Passet. 2023. Sketchfab. https://sketchfab.com/
[12]
Sören Discher, Rico Richter, and Jürgen Döllner. 2019. Concepts and techniques for web-based visualization and processing of massive 3D point clouds with semantics. Graphical Models, Vol. 104 (2019), 101036.
[13]
Alastair F Donaldson, Ben Clayton, Ryan Harrison, Hasan Mohsin, David Neto, Vasyl Teliman, and Hana Watson. 2023. Industrial Deployment of Compiler Fuzzing Techniques for Two GPU Shading Languages. In 2023 IEEE Conference on Software Testing, Verification and Validation (ICST). IEEE, 374--385.
[14]
Landon Dyken and Pravin Poudel. 2022. GraphWaGu: GPU Powered Large Scale Graph Layout Computation and Rendering for the Web. In Eurographics Symposium on Parallel Graphics and Visualization.
[15]
Jakub Floty'nski, Krzysztof Walczak, and Marcin Krzyszkowski. 2020. Composing customized web 3D animations with semantic queries. Graphical Models, Vol. 107 (2020), 101052.
[16]
Willis Fulmer, Tahir Mahmood, Zhongyu Li, Shaoting Zhang, Jian Huang, and Aidong Lu. 2019. ImWeb: Cross-platform immersive web browsing for online 3D neuron database exploration. In Proceedings of the 24th International Conference on Intelligent User Interfaces. 367--378.
[17]
Tower Game. 2023. Tower Game. https://www.towergame.app/
[18]
Xiang Gong, Chunling Hu, and Chu-Cheow Lim. 2020. PAQSIM: Fast Performance Model for Graphics Workload on Mobile GPUs. In The 21st ACM SIGPLAN/SIGBED Conference on Languages, Compilers, and Tools for Embedded Systems. 3--14.
[19]
Google. 2023. Blink. https://www.chromium.org/blink/
[20]
Khronos Group. 2023 a. OpenGL Shading Language. https://www.khronos.org/opengl/wiki/OpenGL_Shading_Language
[21]
Khronos Group. 2023 b. Vulkan Toturial. https://vulkan-tutorial.com/Drawing_a_triangle/Graphics_pipeline_basics/Introduction
[22]
Ujjwal Gupta, Manoj Babu, Raid Ayoub, Michael Kishinevsky, Francesco Paterna, Suat Gumussoy, and Umit Y Ogras. 2018. An online learning methodology for performance modeling of graphics processors. IEEE Trans. Comput., Vol. 67, 12 (2018), 1677--1691.
[23]
Masatoshi Hidaka, Yuichiro Kikura, Yoshitaka Ushiku, and Tatsuya Harada. 2017. Webdnn: Fastest dnn execution framework on web browser. In Proceedings of the 25th ACM international conference on Multimedia. 1213--1216.
[24]
Yakun Huang, Xiuquan Qiao, Pei Ren, Ling Liu, Calton Pu, and Junliang Chen. 2019. A lightweight collaborative recognition system with binary convolutional neural network for mobile web augmented reality. In 2019 IEEE 39th International Conference on Distributed Computing Systems (ICDCS). IEEE, 1497--1506.
[25]
Jonatan Hvass, Oliver Larsen, Kasper Vendelbo, Niels Nilsson, Rolf Nordahl, and Stefania Serafin. 2017. Visual realism and presence in a virtual reality game. In 2017 3DTV conference: The true vision-capture, Transmission and Display of 3D video (3DTV-CON). IEEE, 1--4.
[26]
Micha? Ja?d?yk. 2023. Minecraft client written in Javascript. https://github.com/michaljaz/webmc
[27]
Rabimba Karanjai. 2018. Optimizing Web Virtual Reality. Ph.,D. Dissertation. Rice University.
[28]
Tomohiro Kawanabe, Kazuma Hatta, and Kenji Ono. 2020. ChOWDER: A New Approach for Viewing 3D Web GIS on Ultra-High-Resolution Scalable Display. In 2020 IEEE International Conference on Cluster Computing (CLUSTER). IEEE, 412--413.
[29]
Michael Kenzel, Bernhard Kerbl, Dieter Schmalstieg, and Markus Steinberger. 2018. A high-performance software graphics pipeline architecture for the GPU. ACM Transactions on Graphics (TOG), Vol. 37, 4 (2018), 1--15.
[30]
Khronos. 2023 a. OpenGL ES. https://www.khronos.org/opengles/
[31]
Khronos. 2023 b. Vulkan. https://www.vulkan.org/
[32]
Jonas Kordt, Paul Brachmann, Daniel Limberger, and Christoph Lippert. 2021. Interactive Volumetric Region Growing for Brain Tumor Segmentation on MRI using WebGL. In The 26th International Conference on 3D Web Technology. 1--8.
[33]
Zeqi Lai, Y Charlie Hu, Yong Cui, Linhui Sun, and Ningwei Dai. 2017. Furion: Engineering high-quality immersive virtual reality on today's mobile devices. In Proceedings of the 23rd Annual International Conference on Mobile Computing and Networking. 409--421.
[34]
Samuli Laine, Janne Hellsten, Tero Karras, Yeongho Seol, Jaakko Lehtinen, and Timo Aila. 2020. Modular primitives for high-performance differentiable rendering. ACM Transactions on Graphics (TOG), Vol. 39, 6 (2020), 1--14.
[35]
Jose Roberto Lazzareschi. 2023. Pinus Tree. http://jrlazz.eu5.org/anim/pinus_noSh.html
[36]
Reese Levine, Mingun Cho, Devon McKee, Andrew Quinn, and Tyler Sorensen. 2023 a. GPUHarbor: Testing GPU Memory Consistency at Large (Experience Paper). (2023).
[37]
Reese Levine, Tianhao Guo, Mingun Cho, Alan Baker, Raph Levien, David Neto, Andrew Quinn, and Tyler Sorensen. 2023 b. MC mutants: Evaluating and improving testing for memory consistency specifications. In Proceedings of the 28th ACM International Conference on Architectural Support for Programming Languages and Operating Systems, Volume 2. 473--488.
[38]
Wei Li, Shanshan Wang, Weidong Xie, Kun Yu, and Chaolu Feng. 2023. Large scale medical image online three-dimensional reconstruction based on WebGL using four tier client server architecture. Information Visualization, Vol. 22, 2 (2023), 100--114.
[39]
Xianfeng Li, Gengchao Li, and Xiaole Cui. 2020. Retriple: reduction of redundant rendering on android devices for performance and energy optimizations. In 2020 57th ACM/IEEE Design Automation Conference (DAC). IEEE, 1--6.
[40]
Chang Liu, Wei Tsang Ooi, Jinyuan Jia, and Lei Zhao. 2018a. Cloud baking: Collaborative scene illumination for dynamic Web3D scenes. ACM Transactions on Multimedia Computing, Communications, and Applications (TOMM), Vol. 14, 3s (2018), 1--20.
[41]
Luyang Liu, Hongyu Li, and Marco Gruteser. 2019. Edge assisted real-time object detection for mobile augmented reality. In The 25th annual international conference on mobile computing and networking. 1--16.
[42]
Luyang Liu, Ruiguang Zhong, Wuyang Zhang, Yunxin Liu, Jiansong Zhang, Lintao Zhang, and Marco Gruteser. 2018b. Cutting the cord: Designing a high-quality untethered vr system with low latency remote rendering. In Proceedings of the 16th Annual International Conference on Mobile Systems, Applications, and Services. 68--80.
[43]
Xun Luo, Robert Kenyon, Derek Kamper, Daniel Sandin, and Thomas DeFanti. 2007. The effects of scene complexity, stereovision, and motion parallax on size constancy in a virtual environment. In 2007 IEEE Virtual Reality Conference. IEEE, 59--66.
[44]
Dzmitry Malyshau. 2020. A Taste of WebGPU in Firefox. https://hacks.mozilla.org/2020/04/experimental-webgpu-in-firefox/
[45]
Myles Maxfield. 2019. WebGPU and WSL in Safari. https://webkit.org/blog/9528/webgpu-and-wsl-in-safari/
[46]
Microsoft. 2023. Direct3D 12. https://learn.microsoft.com/en-us/windows/win32/direct3d12/what-is-directx-12-
[47]
Hasan Mohsin. 2022. WGSLsmith: a random generator of WebGPU shader programs. Master's thesis, Imperial College London (2022).
[48]
Mozilla. 2023. Gecko. https://developer.mozilla.org/en-US/docs/Glossary/Gecko
[49]
Niantic. 2023. 8thWall. https://www.8thwall.com/
[50]
Orillusion. 2023. Orillusion. https://github.com/Orillusion/orillusion
[51]
Hui Peng, Zhihao Yao, Ardalan Amiri Sani, Dave Jing Tian, and Mathias Payer. 2023. GLeeFuzz: Fuzzing WebGL Through Error Message Guided Mutation. USENIX Security'23 (2023).
[52]
Playcanvas. 2023. Playcanvas. https://github.com/playcanvas/engine
[53]
Daniel Pohl, Nural Choudhury, and Markus Achtelik. 2018. Concept for Rendering Optimizations for Full Human Field of View HMDs. In 2018 IEEE Conference on Virtual Reality and 3D User Interfaces (VR). IEEE, 663--664.
[54]
Eric D Ragan, Doug A Bowman, Regis Kopper, Cheryl Stinson, Siroberto Scerbo, and Ryan P McMahan. 2015. Effects of field of view and visual complexity on virtual reality training effectiveness for a visual scanning task. IEEE transactions on visualization and computer graphics, Vol. 21, 7 (2015), 794--807.
[55]
Mohammadreza Saed, Yuan Hsi Chou, Lufei Liu, Tyler Nowicki, and Tor M Aamodt. 2022. Vulkan-Sim: A GPU Architecture Simulator for Ray Tracing. In 2022 55th IEEE/ACM International Symposium on Microarchitecture (MICRO). IEEE, 263--281.
[56]
Ales Saska, David Tichy, Robert Moore, Achilles Rasquinha, Caner Akdas, Xiaodong Zhao, Renato Fabbri, Ana Jelivc ić, Gaurav Grover, Himanshu Jotwani, et al. 2020. ccNetViz: a WebGL-based JavaScript library for visualization of large networks. Bioinformatics, Vol. 36, 16 (2020), 4527--4529.
[57]
Markus Schütz, Bernhard Kerbl, and Michael Wimmer. 2021. Rendering point clouds with compute shaders and vertex order optimization. In Computer Graphics Forum, Vol. 40. Wiley Online Library, 115--126.
[58]
Rahul Singh, Muhammad Huzaifa, Jeffrey Liu, Anjul Patney, Hashim Sharif, Yifan Zhao, and Sarita Adve. 2023. Power, performance, and image quality tradeoffs in foveated rendering. In 2023 IEEE Conference Virtual Reality and 3D User Interfaces (VR). IEEE, 205--214.
[59]
Lisa St"ahli, David Rudi, and Martin Raubal. 2018. Turbulence ahead-a 3D web-based aviation weather visualizer. In Proceedings of the 31st annual ACM symposium on user interface software and technology. 299--311.
[60]
Kay M Stanney, Kelly S Kingdon, David Graeber, and Robert S Kennedy. 2002. Human performance in immersive virtual environments: Effects of exposure duration, user control, and scene complexity. Human performance, Vol. 15, 4 (2002), 339--366.
[61]
Three.js. 2023 a. The Forum of Three.js. https://discourse.threejs.org/c/showcase/7
[62]
Three.js. 2023 b. Three.js. https://github.com/mrdoob/three.js/
[63]
Rhodora Vennarucci, David Fredrick, Davide Tanasi, Nicholas Reynolds, Kaitlyn Kingsland, Brianna Jenkins, and Stephan Hassam. 2021. In Ersilia's Footsteps: Toward an Interactive WebGL Application for Exploring the Villa Romana del Casale at Piazza Armerina, Sicily. In The 26th International Conference on 3D Web Technology. 1--7.
[64]
W3C. 2023 a. WebGL. https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API
[65]
W3C. 2023 b. WebGPU. https://www.w3.org/TR/webgpu/
[66]
W3C. 2023 c. WebGPU Shading Language. https://www.w3.org/TR/WGSL/
[67]
W3C. 2023 d. WebXR. https://immersiveweb.dev/
[68]
Corentin Wallez, Brandon Jones, and François Beaufort. 2023. WebGPU: Unlocking modern GPU access in the browser. https://developer.chrome.com/blog/webgpu-io2023/
[69]
Chao Wang, Shuanq Lianq, and Jinyuan Jia. 2018. Immersing Web3D Furniture into Real Interior Images. In 2018 IEEE Conference on Virtual Reality and 3D User Interfaces (VR). IEEE, 721--722.
[70]
Robert B Welch, Theodore T Blackmon, Andrew Liu, Barbara A Mellers, and Lawrence W Stark. 1996. The effects of pictorial realism, delay of visual feedback, and observer interactivity on the subjective sense of presence. Presence: Teleoperators & Virtual Environments, Vol. 5, 3 (1996), 263--273.
[71]
Wonderstruck. 2023. Polycraft. http://polycraftgame.com/
[72]
Shujiang Wu, Song Li, Yinzhi Cao, and Ningfei Wang. 2019. Rendered private: Making $$GLSL$$ execution uniform to prevent $$WebGL-based$$ browser fingerprinting. In 28th USENIX Security Symposium (USENIX Security 19). 1645--1660.
[73]
Wunderdog. 2023. Bubble Figure. https://github.com/wunderdogsw/go-23-app
[74]
Kui Xu, Nan Liu, Jingle Xu, Chunlong Guo, Lingyun Zhao, Hong-Wei Wang, and Qiangfeng Cliff Zhang. 2021. VRmol: an integrative web-based virtual reality system to explore macromolecular structure. Bioinformatics, Vol. 37, 7 (2021), 1029--1031.
[75]
Simin Yang, Ze Gao, Reza Hadi Mogavi, Pan Hui, and Tristan Braud. 2023. Tangible Web: An Interactive Immersion Virtual Reality Creativity System that Travels Across Reality. In Proceedings of the ACM Web Conference 2023. 3915--3922.
[76]
Zhihao Yao, Saeed Mirzamohammadi, Ardalan Amiri Sani, and Mathias Payer. 2018. Milkomeda: Safeguarding the mobile gpu interface using webgl security checks. In Proceedings of the 2018 ACM SIGSAC Conference on Computer and Communications Security. 1455--1469.
[77]
Shaokun Zheng, Zhiqian Zhou, Xin Chen, Difei Yan, Chuyan Zhang, Yuefeng Geng, Yan Gu, and Kun Xu. 2022. LuisaRender: A High-Performance Rendering Framework with Layered and Unified Interfaces on Stream Architectures. ACM Transactions on Graphics (TOG), Vol. 41, 6 (2022), 1--19.
[78]
Wen Zhou, Kai Tang, and Jinyuan Jia. 2018. S-LPM: segmentation augmented light-weighting and progressive meshing for the interactive visualization of large man-made Web3D models. World Wide Web, Vol. 21 (2018), 1425--1448. io
Index Terms
- FusionRender: Harnessing WebGPU's Power for Enhanced Graphics Performance on Web Browsers
Recommendations
Physically-based Path Tracer using WebGPU and OpenPBR
Web3D '24: Proceedings of the 29th International ACM Conference on 3D Web TechnologyThis work presents a web-based, open-source path tracer for rendering physically-based 3D scenes using WebGPU and the OpenPBR surface shading model. While rasterization has been the dominant real-time rendering technique on the web since WebGL’s ...
Web Image Formats: Assessment of Their Real-World-Usage and Performance Across Popular Web Browsers
Product-Focused Software Process ImprovementAbstractIn 2023, images on the web make up 41% of transmitted data, significantly impacting the performance of web apps. Fortunately, image formats like WEBP and AVIF could offer advanced compression and faster page loading but may face performance ...
WebGL vs. WebGPU: A Performance Analysis for Web 3.0
AbstractThis study investigates web 3.0 heterogeneous computing with webGL, webGPU, and IPFS. The primary focus is on the benefits of utilising these technologies to enhance the functionality and performance of web 3.0 applications. The study investigates ...
Comments
Please enable JavaScript to view thecomments powered by Disqus.Information & Contributors
Information
Published In
May 2024
4826 pages
ISBN:9798400701719
DOI:10.1145/3589334
- General Chairs:
- Tat-Seng Chua,
- Chong-Wah Ngo,
- Proceedings Chair:
- Roy Ka-Wei Lee,
- Program Chairs:
- Ravi Kumar,
- Hady W. Lauw
Copyright © 2024 ACM.
Permission to make digital or hard copies of all or part of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for components of this work owned by others than the author(s) must be honored. Abstracting with credit is permitted. To copy otherwise, or republish, to post on servers or to redistribute to lists, requires prior specific permission and/or a fee. Request permissions from [email protected].
Sponsors
Publisher
Association for Computing Machinery
New York, NY, United States
Publication History
Published: 13 May 2024
Check for updates
Badges
Author Tags
Qualifiers
- Research-article
Funding Sources
- National Natural Science Foundation of China
Conference
WWW '24
Sponsor:
Acceptance Rates
Overall Acceptance Rate 1,899 of 8,196 submissions, 23%
Contributors
Other Metrics
Bibliometrics & Citations
Bibliometrics
Article Metrics
- View Citations1Total Citations
- 196Total Downloads
- Downloads (Last 12 months)196
- Downloads (Last 6 weeks)28
Reflects downloads up to 27 Feb 2025
Other Metrics
Citations
Cited By
View all- Stucki SAckermann P(2024)Physically-based Path Tracer using WebGPU and OpenPBRProceedings of the 29th International ACM Conference on 3D Web Technology10.1145/3665318.3677158(1-6)Online publication date: 25-Sep-2024
View Options
Login options
Check if you have access through your login credentials or your institution to get full access on this article.
Sign in