Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation.
Examples of behavior that contributes to creating a positive environment include:
Using welcoming and inclusive language
Being respectful of differing viewpoints and experiences
Gracefully accepting constructive criticism
Focusing on what is best for the community
Showing empathy towards other community members
Examples of unacceptable behavior by participants include:
The use of sexualized language or imagery and unwelcome sexual attention or advances
Trolling, insulting/derogatory comments, and personal or political attacks
Public or private harassment
Publishing others' private information, such as a physical or electronic address, without explicit permission
Other conduct which could reasonably be considered inappropriate in a professional setting
Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.
Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.
This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers.
Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at sjfricke@wisc.edu. All complaints will be reviewed and investigated and will result in a response that is deemed necessary and appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
This Code of Conduct is adapted from the Contributor Covenant, version 1.4, available at http://contributor-covenant.org/version/1/4
Please ensure your pull request adheres to the following guidelines:
If you forget any of these I will nicely ask you to change it in the pull request.
Make an individual pull request for each suggestion.
You can either add a link or new categories, or improvements... all are welcome.
If you have other ideas for discussion please leave an issue.
Use the following format: [NAME](LINK) - DESCRIPTION.
Keep descriptions simple.
Titles should be .
Make pull request titles descriptive i.e. not Updated README.
Link additions should be added to the bottom of the relevant category.
New sub-category are placed in alphabetical order.
New entries for the libraries/frameworks section are placed in alphabetical order.
New categories or improvements to the existing categorization are welcome.
Check your spelling and grammar.
Make sure your text editor is set to remove trailing whitespace.
End all descriptions with a period.
No Amazon affiliate codes in links for books.
Add authors in book listing with by **Author** format.
Fork the repository to your account.
Create a new branch so you can send your changes in a pull request.
Add your changes.
Scroll down to the Propose file change box and write a commit message and optional extended description.
Click the Propose file change button.
NOTE: this works the same for any of the files
Please ensure your pull request adheres to the following guidelines:
If you forget any of these I will nicely ask you to change it in the pull request.
NOTE: Just because the library isn't in the README.md file doesn't mean it can't be in the Libraries.md file
Always keep lines aligned vertically to make it easier to edit.
Feel free to edit/add in the Column Key.
If adding or removing a mark from the table please acknowledge why you made that decision in your pull request description.
If adding, put the **X** left aligned in the box.
If adding a library make sure it is in alphabetical order.
Also make the name linked to the libraries' main page.
If adding a column you need to do the following:
Make sure it is placed in alphabetical order.
add the spaces to each row for that column (Alt+Shift in Notepad++ takes care of that easily).
Add in the Column Key in the alphabetical order and give description for what that column means.
Use the [Category](#category) format to link it to the Column Key.
Always keep lines aligned vertically to make it easier to edit.
All items in cell are left aligned.
If adding a library make sure it is in alphabetical order.
Also make the name linked to the libraries' main page.
All sizes are listed as either:
MB with 2 decimal places.
(Example: 3.23)
KB as MB with leading zero and 3 decimal.
(Example: 0.304)
MATH NOTE: 400KB != 0.400MB
You need to divide by 1024
So 400KB is 400 / 1024 = 0.332MB
Make sure you have a free GitHub.com account and you are logged in.
Fork the repository to your account.
Create a new branch so you can send your changes in a pull request.
Add your changes.
Scroll down to the Propose file change box and write a commit message and optional extended description.
Click the Propose file change button.
NOTE: this works the same for any of the files
Make sure you have a free account and you are logged in.
Find an appropriate topic category in the file to add it under, or add your own if you think it is needed.
Click the button on the top right-hand corner of the README.md. This will do two things:
Find an appropriate topic category in the file to add it under, or add your own if you think it is needed.
Click the button on the top right-hand corner of the README.md. This will do two things:
Libraries/Frameworks all have one goal: Use abstraction to allow you to spend more time developing the features of your application
With this, we are not here to judge or say which library is "better" as that is not a feasible question to answer. So what we can offer is a chart to show you what each library has to offer in terms of things it will help abstracts for you
X -> Supports features
Libraries
X
X
X
X
X
Supports adding 2D images or sprites as a 2D element.
Supports adding text into the scene as a 2D element.
Supports animation of models.
Supports loading in audio.
Supports exporting models or scenes to file or other formats.
Supports importing of 3D models and/or images.
Supports with all the fun matrix and vector math.
Supports modeling 3D objects.
Supports showing or using point cloud data.
Supports a physics engine for simulation.
Supports advance features for rendering.
Supports creating your own shaders for use in project.
Supports adding textures to models and materials.
Supports the ability to be display WebVR on mobile devices.
Sometimes load time is a factor in picking a library so here is a list of the different size presented by each library/framework
0.8.2
2.03
1.05
2.82
Only Minified
1.57
3.2
3.41 to 4.66
1.78 to 2.95
Can generate custom builds, showing ranges
1.15
Only Minified
0.432
1.48
10.0
2.83
0.9
0.719
0.358
2.7.0
0.166
0.046
0.6.5
0.113
0.053
4.8.1
1.28
0.412
1.3.1
0.261
0.071
4.2.0
0.549
0.235
0.1.3
0.043
0.013
r95
1.05
0.521
4.4.0
0.220 to 0.330
0.023 to 0.067
There is a TWGL and TWGL-full version
2.1.6
0.262
0.084
這是一個很棒的 WebGL 庫、資源等的精選列表。
WebGL（Web 圖形庫）是一種 JavaScript API，用於在內部渲染交互式 3D 計算機圖形和 2D 圖形 任何不使用插件的兼容網絡瀏覽器。WebGL 已完全集成到所有 Web 標準中 瀏覽器允許 GPU 加速使用物理和圖像處理以及作為網頁畫布一部分的效果。
WebGL 元素可以與其他 HTML 元素混合，並與頁面或頁面背景的其他部分合成。 WebGL 程序由用 JavaScript 編寫的控制代碼和在計算機圖形上執行的著色器代碼組成 處理單元 (GPU)。
＃＃ 內容
所有與 WebGL 打交道的事情
WebGL 文章和/或博客文章（非教程）
WebGL 主題博客系列
關於 WebGL 的熱門書籍
從長遠來看，報告錯誤對每個人都有幫助
[WebKit Bugzilla](https://bugs.webkit.org/enter_bug.cgi?assigned_to=cmarrin%40apple.com&attachurl=&blocked=&bug_file_loc=http%3A%2F%2F&bug_severity=Normal&bug_status=NEW&comment=&component=WebGL&contenttypeentry=&contenttypemethod= autodetect&contenttypeselection=text%2Fplain&data=&dependson=&description=&flag_type-1=X&flag_type-3=X&form_name=enter_bug&keywords=&maketemplate=Remember%20values%20as%20bookmarkable%20template&op_sys=Mac%20OS%20X%2010.5&priority=P2&product=WebKit&hordesc&rep_platform=P2&產品=WebKit&hordesc&rep_platform= =528%2B%20%28Nightly%20build%29) - Safari 相關的錯誤
在線 GLSL 編輯器
＃＃＃ 參考
WebGL 參考資料
WebGL 相關講座
用於開發和調試 WebGL 的工具
###教程
在線 WebGL 教程（非視頻）
WebGL 相關視頻
有關即將推出的 WebGL 2 規範的信息
WebGL 2 文章和/或博客文章（非教程）
＃＃＃ 參考
WebGL 2 參考資料
###教程
WebGL 相關視頻
關於新的和即將到來的 WebVR 生態系統的不同部分的信息
所有項目都與更多的開發人員相關，而較少涉及在哪裡可以找到 WebVR 內容作為娛樂
WebVR 文章和/或博客文章（非教程）
維護了以 WebVR 為重點的主題的博客系列
WebVR 設計的平台來體驗
＃＃＃ 參考
WebVR 參考資料
＃＃＃＃ 計算機視覺
＃＃＃＃ 粒子
＃＃＃ 數學
###物理
＃＃＃ 其他
＃＃ 社區
活躍的聚會小組
類似的很棒的列表
＃＃ 執照
- 當您遇到可怕的上下文丟失時如何管理 WebGL。
- 如何在 WebGL 中使用 Web Workers。
- 經證明適用於創建基於 WebGL 的交互的優化技術.
- 通過繪製三角形了解什麼是 WebGL 及其工作原理。
- 許多關於不同技巧和技術的博客。
- 這是《實時渲染》一書的博客。
- Mozilla 的官方最佳實踐集。
- 這是 WebGL Insights 一書的博客。
– 一個月的每日 WebGL 教程。
Edward Angel 和 * Dave Shreiner* - 適合計算機科學與工程專業的本科生，具有良好編程技能的其他學科的學生，以及對使用最新版本的 WebGL 的計算機動畫和圖形感興趣的專業人士。
作者 Andreas Anyuru - 關於開發硬件加速 3D 你需要知道的一切使用 WebGL 的圖形。
by Tony Parisi - 創建高性能，視覺震撼Web 的 3D 應用程序，使用 HTML5 和相關技術，例如 CSS3 和 WebGL——新興的 Web 圖形標準。
作者：Diego Cantor 和 Brandon Jones - 適用於 JavaScript 開發人員想通過 WebGL 涉足 3D 網絡開發。
by Mitch Williams - 適用於希望擴展 3D 圖形概念知識的網頁設計師並拓寬您現有的技能組合。
作者：Patrick Cozzi -通過匯集經驗豐富的 WebGL 引擎和應用程序開發人員、GPU 供應商、瀏覽器開發人員、研究人員和教育工作者的貢獻，為中級和高級 WebGL 開發人員展示真實世界的技術。
Kouichi Matsuda 和 **Rodger Lea ** - WebGL 編程指南將幫助您快速開始交互式 WebGL 3D 編程，即使您事先不了解 HTML5、JavaScript、3D 圖形、數學或 OpenGL。
- Chrome 相關錯誤
- 規範或一致性相關的錯誤
- Firefox 相關錯誤
注意：
- 在線分形瀏覽器，讓您探索 2D 和 2D 分形。
- 片段著色器的在線實時編輯器。
- 片段著色器沙箱支持 。
- 最流行的片段著色器實時編輯器。
- WebGL 著色器編輯器和作曲器。
- 實時 GLSL 著色器編輯器、查看器和驗證器。
- 無依賴性著色器編輯器，具有內聯錯誤日誌、自動完成、模型和紋理加載功能。
- Windows 平台上 Google Chrome 和 Mozilla Firefox 的默認 WebGL 後端。
- WebGL 的官方維基。
- 其目標是幫助將高性能虛擬現實帶入開放網絡。
- 圖形驅動程序中的已知錯誤會影響一致性套件，從而影響代碼的可移植性。
- WebGL 擴展列表
- 用於打印的 WebGL 1.0 API 快速參考卡。
- 查看和貢獻的源代碼。
- 關於 WebGL 的所有詳細信息。
- Khronos 提供的各種 WebGL 相關演示列表。
- 來自 Ricardo Cabello (MrDoob) 的 Google I/O 19 演講。
- 有用的 WebGL 開發工具，旨在用作 ES6 模塊。
- 不可知的 JavaScript 框架，用於探索 WebGL 場景並對其進行故障排除。
- 受 gDEBugger 和 PIX 啟發的工具，旨在簡化高級 WebGL 應用程序的開發。
- 該編輯器讓您可以同時處理 JavaScript 代碼和 GLSL 頂點/片段著色器（如果有的話）方便的方式。一切都按照您的意願進行了組織、格式化和突出顯示。
- 查看您的瀏覽器對 WebGL 支持的詳細信息的方法。
- 交互式儀表板顯示不同瀏覽器和設備對 WebGL 功能的支持。
- 嘗試加載 WebGL 支持的每種紋理格式之一，旨在快速顯示您的瀏覽器/設備支持哪些格式。
- 用於跟踪和調查復雜 Web 應用程序的庫、工具和可視化工具集。
- Chrome DevTools 擴展，可幫助您在瀏覽器中實時編輯著色器。
- 輕鬆探索 WebGL 和 WebGL2 場景並排除故障。
- Chrome 擴展 WebGL 調試工具包，提供多種功能。
- 如何使用 Firefox 的開發者工具調試 WebGL 著色器的快速教程.
- Firefox 所有調試器工具的官方列表。
- 快速教程如何使用 Firefox 的開發者工具調試 WebGL 著色器.
- 實時定向光影映射背後的概念。
- Khronos 的教程如何啟動和運行 WebGL。
- Mozilla 基金會 WebGL 入門指南。
- Tutorials Point 系列文章，讓您熟悉 WebGL 術語。
- 來自_WebGL Up and Running_作者的教程。
- 如何使用 blendmap 對地形進行多紋理處理。
- 通過應用稱為廣告牌的技術創建粒子效果。
- 循序漸進地指導片段著色器抽象而復雜的世界。
- 簡化的在線 IDE，具有自動縮進、HTML、Javascript、GLSL 和 Python 語法突出顯示。您可以運行您的代碼並下載您的項目。
- 包含代碼示例和現場演示的在線教程系列。
- 交互式研討會讓您開始使用 WebGL。
- SIGGRAPH 大學對 WebGL 的 3 小時概述。
- 來自 YouTube 上 Indigo Code 的一系列講座式視頻教程。
一般與 WebGL 有關的任何內容都可以在 部分找到
- 查看 WebGL 2 中添加的新功能。
- 查看 WebGL 2 即將推出的功能。
- Zhenyao Mo、Ken Russell 在 SIGGRAPH Asia 2015 期間的演講。
- 從 Firefox 51 開始支持 WebGL 2 的信息。
- 關於 WebGL 2 入門的博文。
- 關於 WebGL 2 的新功能和酷炫功能的博客文章。
- 關於 WebGL 2 的所有詳細信息。
- 用於打印的 WebGL 2.0 API 快速參考卡。
- 顯示當前支持 WebGL 2 的瀏覽器的圖表
- 包含代碼示例和現場演示的在線教程系列。
- 許多不同的 WebGL 2 工作的重要來源以及非常好的評論。
- 在原始 WebGL 2 中實現的渲染算法。
- WebGL 2 入門視頻教程系列，仍在積極添加視頻。
- Khronos 網絡研討會 2017 年 4 月。
- 來自 Firefox 製造商的專注於 WebVR 的博客。
- 網頁作為通過門戶互連的協作 3D 網絡空間。
- 顯示瀏覽器、耳機和操作系統的支持。
- Mozilla 的官方 WebVR 頁面。
- 幫助在 WebVR 中創建良好用戶體驗的精選資源列表。
- WebXR 的 W3C 草案 API。
- 官方 W3C WebVR 規範（舊版）。
- 用 JavaScript 編寫的 2D 剛體物理引擎。
- 用於 Canvas 和 WebGL 的開源 HTML5 2D 遊戲框架，支持移動網絡瀏覽器。
- 基於 WebGL 的強大的 2D Javascript 渲染器。
- 用於跨平台 HTML5 遊戲開發的 2D 物理引擎。
- 用於跨平台 HTML5 遊戲開發的 2D 庫。
- 用於瀏覽器的 WebGL 加速計算機視覺庫。
- 非常小的低級 WebGL 庫，提供提供高性能體驗的要素。
- 世界級 3D 地球儀和地圖的開源庫。
- 用於 React 的 WebGL 覆蓋套件，提供一組高性能數據可視化覆蓋。
- WebGL2 驅動的框架，用於 GPU 驅動的數據可視化和計算。
- WebGL 上的數據驅動 3D 可視化引擎。
- 用於高性能 WebGL 應用程序的 Javascript 矩陣和向量庫。
- Sylvester 是一個用於 JavaScript 的矢量、矩陣和幾何庫。
- 唯一目的是使 WebGL API 的使用不那麼冗長。
- 3D 圖形極客的渲染庫。
- Web 工程師和 CG 工程師之間的橋樑。
- 用於 3D 遊戲的 WebGL 渲染引擎。
- 使用 Emscripten 將 Bullet 物理引擎直接移植到 JavaScript。
- 用於網絡的輕量級和簡單的 3D 物理引擎。
- 最小的 WebGL 2-only 渲染庫。
- 用於構建虛擬現實體驗的 Web 框架。
- 桌面應用程序，讓您無需先前的編碼知識即可以交互方式創建 WebVR 和原型。
- 使用 Lua 創建 VR 的簡單框架。
- 使用 React 構建 VR 網站和交互式 360 度體驗。
- 在您的瀏覽器中快速構建 VR 應用程序原型。
- 用於使用 HTML5、WebGL 和 Web Audio 構建 3D 遊戲的完整 JavaScript 框架。
- 互聯網上交互式 3D 可視化工具。
- 用於構建可擴展的 Web3D 應用程序的 WebGL 圖形庫。
- 用於創建遊戲和 3D 應用程序的 JavaScript 庫和 WebGL 3D 引擎。
- 旨在簡化 WebGL 使用的 Javascript 庫。
- 輕量級和明確的庫來幫助原型。
- 基於 OpenSceneGraph 概念與 WebGL 交互的 WebGL 框架。
- Plask/Node.js 和 WebGL 中用於計算思維的 JavaScript 庫。
- 構建互動體驗的遊戲引擎平台。
- 完全可定制的 webgl 著色器沙箱，可嵌入到您的頁面中。
- 輕型聲明和無狀態庫，WebGL 的功能抽象。
- 用於高細節 3D 可視化的可擴展的基於 WebGL 的引擎。
- 旨在創建一個易於使用、輕量級的 3D 庫。
- 模塊化 3D 和 2D 遊戲框架，用於為瀏覽器、桌面和移動設備製作 HTML5 驅動的遊戲。
- 一個藝術家友好的工具包，用於創建 3D 網絡體驗。
- 用於開發具有物理特性的 3D 網絡應用程序的框架。
- 精選的精選列表。
- 很棒的 OpenGL 庫、調試器和資源的精選列表。靈感來自 awesome-... 東西。
- 精選的 Vulkan 項目和生態系統列表。
- 關於遊戲開發的精彩列表。
- 專為網絡設計的運行時 3D 資產交付。
- 圖形編程資源列表。
有關詳細信息，請參閱 。
感謝 的 Travis CI 測試自動化！
在法律允許的範圍內， 已放棄該作品的所有版權和相關或鄰接權。
This is a curated list of awesome WebGL libraries, resources and much more.
WebGL (Web Graphics Library) is a JavaScript API for rendering interactive 3D computer graphics and 2D graphics within any compatible web browser without the use of plug-ins. WebGL is integrated completely into all the web standards of the browser allowing GPU accelerated usage of physics and image processing and effects as part of the web page canvas.
WebGL elements can be mixed with other HTML elements and composited with other parts of the page or page background. WebGL programs consist of control code written in JavaScript and shader code that is executed on a computer's Graphics Processing Unit (GPU).
All things dealing with WebGL
WebGL articles and/or blog posts (non-tutorials)
Context Loss & Preloading - How to manage WebGL when you run into the dreaded context lost.
WebGL Off the Main Thread - How to use Web Workers in WebGL.
Optimizing Scenes for Better WebGL Performance - optimization techniques that proved to work well for creating WebGL-based interactives.
First steps in WebGL - Learn what WebGL is and how it works by drawing a triangle.
Blog series of WebGL topics
Codeflow - Many blogs on different tricks and techniques.
Real-Time Rendering - This is the blog for the book Real-Time Rendering.
WebGL Best Practices - Mozilla's offical set of best practices.
WebGL Insights - This is the blog for the book WebGL Insights.
WebGL Month – Daily WebGL tutorial for a month.
Popular books about WebGL
Interactive Computer Graphics: A Top-Down Approach with WebGL by Edward Angel and Dave Shreiner - Suitable for undergraduate students in computer science and engineering, for students in other disciplines who have good programming skills, and for professionals interested in computer animation and graphics using the latest version of WebGL.
Professional WebGL Programming by Andreas Anyuru - Everything you need to know about developing hardware-accelerated 3D graphics with WebGL.
Programming 3D Applications with HTML5 and WebGL by Tony Parisi - Create high-performance, visually stunning 3D applications for the Web, using HTML5 and related technologies such as CSS3 and WebGL—the emerging web graphics standard.
WebGL Beginner's guide by Diego Cantor and Brandon Jones - For JavaScript developer who wants to take the plunge into 3D web development via WebGL.
WebGL Hotshot by Mitch Williams - For web designer looking to expand your knowledge of 3D graphics concepts and broaden your existing skill set.
WebGL Insights by Patrick Cozzi - Presents real-world techniques for intermediate and advanced WebGL developers by assembling contributions from experienced WebGL engine and application developers, GPU vendors, browser developers, researchers, and educators.
WebGL Programming Guide: Interactive 3D Graphics Programming with WebGL by Kouichi Matsuda and Rodger Lea - WebGL Programming Guide will help you get started quickly with interactive WebGL 3D programming, even if you have no prior knowledge of HTML5, JavaScript, 3D graphics, mathematics, or OpenGL.
Reporting bugs helps everyone in long run
Chrome Bug Report - Chrome related bugs
Khronos Github Issue Page - Spec or Conformance related bugs
Mozilla BugZilla - Firefox related bugs
WebKit Bugzilla - Safari related bugs
Online GLSL Editors
NOTE: WebGL must conform to The OpenGL ES Shading Language, Version 1.00
Fractal Lab - Online fractal explorer allowing you to explore 2D and 2D fractal.
GLSL Sandbox - Online live editor for fragment shaders.
Shader Toy - Most popular live editor for fragment shaders.
ShaderFrog - WebGL Shader Editor and Composer.
SHDR Editor - Live GLSL shader editor, viewer and validator.
ShaderExpo - Dependency free shader editor featuring inline error logs, auto completions, models and textures loading.
WebGL references
Google Project ANGLE - Default WebGL backend for both Google Chrome and Mozilla Firefox on Windows platforms.
Khronos Official Wiki - The official wiki for WebGL.
WebVR Community Group - Group who's goal is to help bring high-performance Virtual Reality to the open Web.
WebGL Errata - Known bugs in graphics drivers affect the conformance suite, and consequently, portability of code.
WebGL Extensions - List of extensions for WebGL
WebGL Reference Card - WebGL 1.0 API Quick Reference Card for printing.
WebGL Source Code - Source code to both view and contribute.
WebGL Spec Sheet - All the detailed information about WebGL.
WebGL related talks
List of Presentations - List presented by Khronos of various WebGL related presentations.
Next-Generation 3D Graphics on the Web - Talk at Google I/O 19 from Ricardo Cabello (MrDoob).
Tools for development and debugging WebGL
Khronos Dev Tools - Useful WebGL developer tools, intended to be used as an ES6 module.
Spector.js - Agnostic JavaScript framework for exploring and troubleshooting your WebGL scenes.
WebGL Inspector - Tool inspired by gDEBugger and PIX with the goal of making the development of advanced WebGL applications easier.
WebGl Playground - The editor lets you work on the JavaScript code and the GLSL vertex/fragment shaders (if you have any) at the same time in a convenient way. Everything is organized, formatted and highlighted properly, just as you would like.
WebGL Report - Way to view the details of what your browser supports for WebGL.
WebGL Support Stats - Interactive dashboard showing the support for WebGL features in different browsers and devices.
WebGL Texture Tester - Attempts to load one of every texture format supported by WebGL, intended to quickly show which formats your browser/device supports.
Web Tracing Framework - Set of libraries, tools, and visualizers for the tracing and investigation of complex web applications.
GLSL Shader Editor Extension - Chrome DevTools extension to help you edit shaders live in the browser.
Spector.js Extension - Explore and Troubleshoot your WebGL and WebGL2 scenes easily.
Webgl Insight - Chrome extension WebGL debugging toolkit providing a variety of capabilities.
Canvas Debugger - Quick tutorial how to use Firefox's developer tools to debug WebGL Shaders.
Firefox Developer Tools - The official list of all of Firefox's debugger tools.
Shader Editor - Quick tutorial how to use Firefox's developer tools to debug WebGL Shaders.
Online WebGL Tutorials (non-video)
Directional Shadow Mapping - Concepts behind real time directional light shadow mapping.
Get Started Tutorial - Khronos' tutorial how to get up and running with WebGL.
Getting Started with WebGL - Mozilla Foundation guide to getting started with WebGL.
Learn WebGL - Tutorials Point set of article to get you familiar with WebGL terms.
Learning WebGL - Tutorials from the author of WebGL Up and Running.
Multitexturing using a Blendmap - How to use a blendmap to multitexture a terrain.
Particle Effects via Billboards - Create particle effects by applying a technique called billboarding.
The Book of Shaders - Gentle step-by-step guide through the abstract and complex universe of Fragment Shaders.
WebGL Academy - Simplified online IDE with automatic indentation, syntax highlighting for HTML, Javascript, GLSL and Python. You can run your code and download your projects.
WebGL Fundamentals - Series of online tutorials with code samples and live demonstrations.
WebGL Workshop - Interactive workshop to get you up and running with WebGL.
WebGL Related Videos
An Introduction to WebGL Programming - 3 hour overview of WebGL by SIGGRAPH University.
WebGL Tutorials - YouTube - Series of lecture style video tutorials from Indigo Code on YouTube.
Information about the upcoming WebGL 2 specs
Anything pertaining to WebGL in general is found in the WebGL section
WebGL 2 articles and/or blog posts (non-tutorials)
WebGL 2 What's New - Look into the new features added in WebGL 2.
What's Coming in WebGL 2.0 - Look into the upcoming features of WebGL 2.
WebGL 2 SIGGRAPH Asia 2015 - Presentation by Zhenyao Mo, Ken Russell of Google during SIGGRAPH Asia 2015.
WebGL 2 Lands in Firefox - Information the support for WebGL 2 starting with Firefox 51.
WebGL 2 Basics - Blog post about getting started with WebGL 2.
WebGL 2 New Features - Blog post about whats new and cool in WebGl 2.
WebGL 2 references
WebGL 2 Spec Sheet (Editor Draft) - All the detailed information about WebGL 2.
WebGL 2 Reference Card - WebGL 2.0 API Quick Reference Card for printing.
WebGL 2 Compatible Chart - Chart to show current browsers supporting WebGL 2
WebGL 2 Fundamentals- Series of online tutorials with code samples and live demonstrations.
WebGL 2 Samples - Great source of many different WebGL 2 work with very good commenting.
WebGL 2 Examples - Rendering algorithms implemented in raw WebGL 2.
WebGL related Videos
Fun with WebGL 2.0 - Video tutorial series on getting started with WebGL 2, still actively adding videos.
WebGL 2.0 is Here: What You Need To Know - Khronos Webinar April 2017.
Information about different parts of the new and upcoming WebVR ecosystem
All items related to more developers and less on where to find WebVR content as entertainment
WebVR articles and/or blog posts (non-tutorials)
Maintained blog series of WebVR focused topics
Mozilla VR Blog - WebVR focused blog from makers of Firefox.
WebVR designed platforms to experience
JanusVR - Webpages as collaborative 3D webspaces interconnected by portals.
WebVR references
Browser Support - Shows support by browser, headset, and OS.
Mozilla VR - Mozilla's official WebVR page.
UX of VR - Curated list of resources to help create good UX in WebVR.
WebXR Device API - The W3C draft API for WebXR.
WebVR Spec - The official W3C WebVR spec (legacy).
More detailed information about the different libraries can be found in the Libraries directory.
p2.js - 2D rigid body physics engine written in JavaScript.
Phaser - Open source HTML5 2D game framework for Canvas and WebGL, supports mobile web browsers.
PixiJS - powerful 2D Javascript renderer based on WebGL.
Planck.js - 2D physics engine for cross-platform HTML5 game development.
Stage.js - 2D Library for cross-platform HTML5 game development.
GammaCV - WebGL accelerated Computer Vision library for browser.
Phenomenon - Very small, low-level WebGL library that provides the essentials to deliver a high performance experience.
Cesium - Open-source library for world-class 3D globes and maps.
Deck.gl - WebGL overlay suite for React providing a set of highly performant data visualization overlays.
Luma.gl - WebGL2 powered framework for GPU-powered data visualization and computation.
xeogl - Data-driven 3D visualization engine on WebGL.
glMatrix - Javascript matrix and vector library for high performance WebGL apps.
Sylvester - Sylvester is a vector, matrix and geometry library for JavaScript.
TWGL - Sole purpose is to make using the WebGL API less verbose.
GLBoost - Rendering library for 3D graphic geeks.
GrimoireGL - Bridge between Web engineers and CG engineers.
Hilo3d - WebGL rendering engine for 3D games.
Ammo.js - Direct port of the Bullet physics engine to JavaScript using Emscripten.
Cannon.js - Lightweight and simple 3D physics engine for the web.
PicoGL.js - Minimal WebGL 2-only rendering library.
A-Frame - Web framework for building virtual reality experiences.
Hologram - Desktop app that let you create and prototype WebVR in interactive way needing no previous coding knowledge.
LÖVR - Simple framework for creating VR with Lua.
React 360 - Build VR websites and interactive 360 experiences with React.
Primrose - Rapidly prototype VR applications in your browser.
Babylon.js - Complete JavaScript framework for building 3D games with HTML5, WebGL and Web Audio.
Blend4Web - Tool for interactive 3D visualization on the Internet.
ClayGL - WebGL graphic Library for building scalable Web3D applications.
CopperLicht - JavaScript library and WebGL 3D engine for creating games and 3D applications.
GLGE - Javascript library intended to ease the use of WebGL.
Lightgl.js - Lightweight and explict library to help prototype.
OSG.js - WebGL framework based on OpenSceneGraph concepts to interact with WebGL.
Pex-gl - JavaScript libraries for computational thinking in Plask/Node.js and WebGL.
PlayCanvas - Game engine platform to build interactive experiences.
Pocket.gl - Fully customizable webgl shader sandbox to embed in your pages.
Regl - Light declarative and stateless library, functional abstraction for WebGL.
Scene.js - Extensible WebGL-based engine for high-detail 3D visualisation.
Three.js - Aimed to create an easy to use, lightweight, 3D library.
Turbulenz - Modular 3D and 2D game framework for making HTML5 powered games for browsers, desktops and mobile devices.
Verge3D - an artist-friendly toolkit for creating 3D web experiences.
Whitestorm.js - Framework for developing 3D web apps with physics.
Active Meetup Groups
Similar awesome lists
awesome - Curated list of awesome lists.
awesome-opengl - Curated list of awesome OpenGL libraries, debuggers and resources. Inspired by awesome-... stuff.
awesome-vulkan - Curated list of awesome Vulkan projects and ecosystem.
gamedev - Awesome list about game development.
glTF - Runtime 3D Asset Delivery designed for the web.
graphics-resources - List of graphic programming resources.
Please see CONTRIBUTING for details.
Travis CI testing automation thanks to awesome_bot!
To the extent possible under law, Spencer Fricke has waived all copyright and related or neighboring rights to this work.
