Posts Tagged "WebKit"

WebGL Coming in Firefox 3.7

Posted by on Sep 21, 2009 in Web | 0 comments

Vladimir Vukićević, the pioneer of bringing the well known OpenGL standard to the web, has just blogged using Firefox to render Spore creatures. Check it out, it’s a pretty impressive demo of this upcoming web standard.

Development on what would become WebGL started back in 2007 with Canvas 3D as an extension for Mozilla Firefox 3.0. Since then it has grown from a single project to an open web standard through the Khronos standards group. The standard is currently under development with a target release date of first half 2010.

Firefox isn’t the only web browser to be experimenting with WebGL, Google and Opera have also pledged to support this standard. The WebKit source code has recently picked up preliminary support.

The web has mostly stayed 2D, but with the advent of CSS Transforms and WebGL, the browser is moving into new territory. The web is evolving into the most important platform of the future.

Read More

Upcoming Web Browser: Google Chrome 3

Posted by on Sep 3, 2009 in Upcoming Web Browsers | 0 comments

The beta version of Chrome has been available for a few months now with a faster Javascript engine, a better new tab look, and the Omnibox (an improved location bar).Google Chrome 3.0.195.10

What key enhancements has Google added for developers? Well Chrome adds support for new features in WebKit:

For users, Chrome add support for custom themes, similar to Firefox’s personas but is more complete by changing the look of the toolbar and the browser pages (new tab page, etc.). See the Google Chrome blog for more info.

Download Google Chrome beta.

Estimated Release Date: 2009?

Read More

Upcoming Web Browser: Safari 5?

Posted by on Aug 30, 2009 in Upcoming Web Browsers | 5 comments

What does Apple have on the horizon for Safari as version 4 was just released 2 months ago (June, 2009)? So far we have not heard anything and that isn’t a huge surprise, Apple is a very secrative company. The good news is that Safari is based on the open source WebKit rendering engine, so we can check out the list of feature enhancements added to WebKit since Safari 4 released with AppleWebKit/531.9.

New WebKit features:

On top of expected HTML, CSS, and JavaScript improvements, Apple will surly tweak the web browser again to build the most usable web browser. It could be a long time before we see Safari 5, or they may release an incremental Safari 4.1. Further details will come as now we can only speculate.

Estimated Release Date: June 2011

Update: Apple has indeed released Safari 5 with a tun of new HTML5 features and performance improvements, and a year ahead of my estimate; check it out at the Safari What’s New page.

Read More

Accelerated CSS Transforms

Posted by on Jul 19, 2009 in Web | 0 comments

Recently the WebKit team added support for CSS transformations with 3D GPU acceleration. This means that soon we can built web applications that mimic desktop applications in graphical responsiveness. Charles Ying wrote a simple image gallery application that demos this new functionality.

This is definitely not yet ready for end users but it demonstrates the power of the web platform and where it is heading. With the native video tag, local and session storage, plus much faster JavaScript engines, browsers are changing from simply presenting information to being a fully interactive platform. It’s no surprise that Google is developing a web-browser operating system, called Chrome OS.

It is also quite encouraging to see the second browser war bring fresh ideas and increase the possibilities to the browser. Competition is great.

Demo of CSS Transforms

Snow Stack in WebKit Nightly r46091

The CSS Transforms were originally created at Apple by Dean Jackson, David Hyatt and Chris Marrin for the iPhone. Apple then improved the spec and submitted it to standardization at the W3C. Firefox 3.5 supports 2D css transforms but does not yet support the newer accelerated 3D animations.

So how does it work?

The images are put on the page using standard CSS and HTML, and they are then animated by JavaScript using these CSS properties:

-webkit-transition-property: -webkit-transform;
-webkit-transform: rotateY(45deg);
-webkit-transition-duration: 2s;

The transition property is set to transform, the transform is set to rotate the image in Y-space by 45 degrees, and the duration is set to 2s. With that, the web browser will take the current position of the image and rotate it by 45 degrees in 2 seconds, which produces an animation effect. How beautifully simple it is!

Read More