webgl

Chrome 渲染流水线演化的未来

12-21
前段时间我写了一篇文章浏览器渲染流水线解析与网页动画性能优化,对目前 60 左右版本的 Chrome 的渲染流水线进行解析,文末也讨论了当前渲染流水线的一些不足和未来演化的方向. 当前的渲染流水线过于复杂和冗长,特别是对于非合成器动画来说,过多的线程/进程间交互增加了不少额外开销,异步光栅化的机制也是有利于合成器动画而不利于非合成器动画.而未来的演化理应需要简化渲染流水线,减少线程/进程间交互,避免非必要的额外开销,光栅化和合成不再像现在一样泾渭分明,渲染流水线可以支持更灵活和动态自适应的图层化

浏览器渲染流水线解析(四)

12-21
5 非合成器动画性能分析和优化指南 前面已经我们已经把非合成器动画区分为 Blink 触发,无法由合成器运行的动画和由 Timer/RAF 驱动的 JS 动画两类,因为前者可以认为是后者的一个简化版本,所以这一章主要讨论 Timer/RAF 驱动的 JS 动画. 5.1 动画流水线 从上图可以看出非合成器动画的流水线比合成器动画更长更复杂,并且非合成器动画的后半段跟合成器动画是一致的. JavaScipt 部分是页端实现的逻辑,可能包含了计算的部分,和调用浏览器提供的 API 的部分(修改 DO

8个惊艳的JavaScript WebGL应用实验

12-21
译文出自:博客园

新界面新功能Firefox 4.0 RC重磅登场

12-21
之前我们曾为大家提供过Firefox 4.0 RC的nightly每日开发版本,相信火狐粉丝们已经提前尝鲜了.今天,Mozilla正式发布了Firefox 4.0 RC. Firefox 4.0 RC主要在之前Beta版的基础上对整体稳定性.性能和兼容性进行了完善和提升,共79种语言版本. 更新日志: - 支持Do Not Track(DNT)header: - 各平台都开启了WebGL: - 默认主页设计进行了更新: - Firefox不再自动转换到离线模式: - 完善了Firefox插件管理

Kataspace:用HTML5和WebGL创建基于浏览器的虚拟世界

12-21
源自斯坦福的创业公司Katalabs发布了一个用于创建基于浏览器的虚拟世界的开源框架. 名叫KataSpace的软件,利用了新兴的HTML5技术,以及WebGL和WebSockets,允许用户无需安装任何插件,直接在浏览器的3D环境中展开互动.Katalabs已经推出了一个演示用的DEMO,它推荐使用Firefox 4 Beta7浏览器.在输入一个用户名,选择一个虚拟化身后,玩家就能进入3D世界,可以看到3D地形和其他用户的化身,用户之间可以用聊天窗口聊天. 原文链接:http://news.c

Firefox 4网页演示:宣布Web O’Wonder的奇迹

12-21
Web'O Wonder   Firefox 4来临,为网站开发人员带来一系列强大功能.   为了列举所有新的技术特征,我们把几种WEB放在一起演示.每周你将看到一对演示版,直到演示火狐4.0.您可以在线观看,在我们有名的新视频网站(Web O'Wonder)看前三个版本的演示.   注:一些视频用WebGL格式,仅会在兼容的硬件上.(仅能运行在兼容的硬件上,确保你的显卡使用的是最新的驱动器.)   打开演示   (我们相信网站不是任何一个浏览器的特权,这就是我们确定这些视频能够运行在其它当代浏

基于Web的3D绘图标准WebGL 1.0发布

12-21
Khronos 组织在游戏开发者大会发布了 WebGL 规范 1.0 正式版本,该版本带来了全新的 OpenGL ES 2.0,使得浏览器可通过 HTML5 和 JavaScript 进行识别,这表明 WebGL 将逐渐进入我们的视野. WebGL 是一种3D绘图标准,这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一起,通过增加OpenGL ES 2.0的一个JavaScript绑定,WebGL可以为HTML5 Canvas提供硬件3D加速渲染,这样Web开发人员就

2D 游戏引擎 AlloyGameEngine

06-09
AlloyGameEngine 详细介绍 AlloyGameEngine 让游戏制作变得超级容易,超快的 2d 渲染引擎,支持 webgl 和 canvas 渲染. 一分钟快速入门 要实现下面的效果: 可以使用下面的代码: var bmp, stage = new Stage("#ourCanvas"); bmp = new Bitmap("img/atLogo.png"); //(0.5,0.5)==〉The center is the point of rota

Uber 开源数据可视化工具 deck.gl 获重大升级

06-02
Uber 今天宣布推出了内部使用数据可视化框架deck.gl的开源版本.deck.gl是一个WebGL驱动的框架,专门用于大规模探索和可视化数据集.事实上去年11月这款工具已经通过开源库面向所有用户开放,在今天获得一些核心功能方面的更新之后,对于寻找各种有趣方式来运用数据的外部团队和独立个体来说变得更加实用,而且还带来了更直观更具魅力的视觉呈现. Uber数据可视化总负责人Nicolas Garcia Belmonte表示:"这个库的主要创意是基于WebGL的框架,用于探索和可视化大规模数据集.

HTML5 学习总结(四)——canvas绘图、WebGL、SVG

11-28
一.Canvas canvas是HTML5中新增一个HTML5标签与操作canvas的javascript API,它可以实现在网页中完成动态的2D与3D图像技术.<canvas> 标记和 SVG以及 VML 之间的一个重要的不同是,<canvas> 有一个基于 JavaScript 的绘图 API,而 SVG 和 VML 使用一个 XML 文档来描述绘图.SVG 绘图很容易编辑与生成,但功能明显要弱一些. canvas可以完成动画.游戏.图表.图像处理等原来需要Flash完成的一

微软专家推荐11个Chrome 插件

11-04
Web开发人员,需要长时间使用浏览器,尽管Windows10 Edge浏览器启动非常快速,且支持110多种设备,Edge支持基于JS 扩展,但也删除了很多旧功能像Active-X等插件.多数情况下,插件不仅可以解决一些安全问题,而且能够有效的解决浏览器负载问题.会在Chrome中每新打开一个标签页,插件都会自行运行,生成新的插件实例.这就意味着如果你打开10个标签页,并且浏览器有10个插件,那么就会造成负载过量的情况.因此选择有效好用的浏览器插件是非常必要的. 下面推荐一些非常有用的Chrome

HTML5 game engines

01-22
  The following are few examples of game engines implemented with HTML5 and JavaScript: Construct 2: One of the first WebGL enabled HTML5 game engines. Exports purely to HTML5 and JavaScript. Uses Canvas only and is extensible with JavaScript plugins

WebGL 入门-WebGL简介与3D图形学

10-31
什么是WebGL? WebGL是一项使用JavaScript实现3D绘图的技术,浏览器无需插件支持,Web开发者就能借助系统显卡(GPU)进行编写代码从而呈现3D场景和对象. WebGL基于OpenGL ES 2.0,OpenGL ES 是 OpenGL 三维图形 API 的子集,针对手机.平板电脑和游戏主机等嵌入式设备而设计.浏览器内核通过对OpenGL API的封装,实现了通过JavaScript调用3D的能力.WebGL 内容作为 HTML5 中的Canvas标签的特殊上下文实现在浏览器中

JavaScript游戏引擎列表

03-20
这里有一个网址收集了关于JS游戏引擎开发库的一个列表,转过来. 游戏引擎 Name Latest Release License Type Notes The Render Engine 1.5.3 MIT 跨浏览器; 大规模 API; 开源.2 gameQuery 0.5.1 CC BY-SA 2.5 和 jQuery 一起使用 gTile 0.0.1 Tile based Akihabara 1.3 GPL2/MIT Classic Repro 基于JS+HTML5的街机风格的游戏3 The

开发者应该关注的五项 Web 新兴技术

03-23
ruce Lowson是Opera开放web标准的撰写人员之一,一些没有包含在HTML5之内的浏览器技术十分奇妙,包括WebGL和SVG,作者希望通过本文与共同爱好者们分享. 最近一位HTML5专家Rich Clark(作者的好朋友)为大家做了一个HTML5 APIs的简介,在文章中为大家指向了一个令人迷惑的网页(web平台:浏览器技术http://platform.html5.org/),其中包含两 个很长的专栏和小正文并提及到一些让人感到迷茫的技术,例如"window.crypto.getR

15 个可在 Chrome 浏览器上体验 WebGL 的例子

03-09
本文中 15 个 WebGL 的例子仅限在 Chrome 浏览器中体验,其他浏览器或许可以,但表现不佳. GLOW – Complicated Aquarium Barry Martin's Hopalong Orbits Visualizer WebGL HelloRacer Materials Cars WebGL Water Lights Red Shooting Hood Surface Nouvelle Vague by ultranoir VideoFX WebGL Bookcase

2011年20大3D网站

01-29
如果要在互联网编年史上描述2011年的话,那么无需任何插件即可在浏览器中直接嵌入支持硬件加速的3D图形一定会被记上重重的一笔. 随着大部分现代浏览器都增加了对WebGL的支持(微软IE除外),以及最近发布的Flash 11,开发者终于可以开始把构建高性能互动3D体验放上议事日程. 目录 1 产品推广类 1.1 1. Rome: 3 Dreams of Black 1.2 2. Nissan: The Planet Zero 1.3 3. Adidas: AdiZero f50 1.4 4. Ni

WEBGL演示

01-29
WebGL是一项在网页浏览器体现3D画面的技术,有别于过往需加装浏览器插件,通过WebGL的技术,只需要编写网页代码即可实现3D图像的展示.WebGL的规格尚在发展中,由非营利的Khronos Group管理. WebGL的工作成员包括Mozilla.Opera.苹果公司,Mozilla的Arun Ranganathan担任主席. 浏览以下WebGL演示页面请使用 Mozilla Firefox.Google Chrome.Opera 12(目前的正式版11.52不支持).Safari 浏览器,

5 个很炫的 HTML5 游戏

12-17
下面是我们为你准备了5款基于 html5/WebGL 的游戏以及游戏演示: 1. Coppercube Backyard 本演示展示现场与许多纹理(> 80),人物动画和摄像机飞行. 2. 3D Social game (WebGL) 这是一个WebGL的演示,是一个下一代3D社交游戏.令人惊叹的3D品质,社会游戏机制. 3. X-Wing 游戏中的飞行和闪躲方式 4. Canvas Rider 有趣的自行车模拟器.需要保持平衡,不会脱落. 5. Barfight! 老式的西方电影,目标是争取酒

HTML5 Ready?我的HTML5整理贴

07-29
在 Apple.Goolge 等大头 IT 公司的推广下,HTML5 正走向我们的技术生活中.回顾历史,这是业界继 AJAX 和 Web 2.0 之后,又一出现的鲜活的名词儿(buzzword).HTML5 下面的技术林林总总,依据不同的 W3C 的规范所构成,但并没有一个严格的标准说明此技术就是 HTML5 的家族成员之一.所谓 HTML5,更像一个多种技术(包括 CSS.JavaScript)的大杂烩.当然,对于 HTML 本身,它是一次重要的升级,比 HTML4/4.2 提供的大得多的新内