javascript - ReadWriteWeb http://www.readwriteweb.com/feeds/tag/javascript en Copyright 2009 Richard MacManus readwriteweb@gmail.com Mon, 23 Nov 2009 16:43:23 -0800 http://www.sixapart.com/movabletype/?v=4.23-en http://blogs.law.harvard.edu/tech/rss Make Your Apps Smooth Like Gmail: Google Open Sources UI Javascript Tools Google is open sourcing a collection of Javascript tools today that will enable developers to build faster, more powerful and more efficient web applications using some of the same code that runs Gmail, Google Maps and Docs.

Why is Google doing this? Because the more powerful web applications become, the more important Google's search, browser and nascent OS become. More relevant to developers than some grand anti-Microsoft conspiracy, though, is that some serious UI sweetness may be forthcoming.

]]>Sponsor

]]> Here's what's being made available today:

The Closure Compiler will scrunch up your weighty javascript for super-efficient deployment, allowing you to do more in the user's browser with a much smaller code payload to deliver. The compiler is available in binary, as a web app and as an API. Google is also releasing a Firebug extension called Closure Inspector that will translate those compiled bits of code back into their original format.

The Closure Library is a collection of cross-browser, modular, "industrial strength" UI components from across the various Google properties. Rich text editor, DOM inspector, drag and drop ala Google Maps - you want it, you got it.

Also released are a number of high-efficiency Closure Templates.

Google's Amit Agarwal says that all of the above were originally built as "20% time" projects but then became fundamental parts of some of the most popular Google applications. Now these technologies can be used in building your apps, as well.

It will be interesting to see how these Google offerings stack up and get adopted compared to Yahoo's YUI library.

]]>Discuss]]>
http://www.readwriteweb.com/archives/google_ui_javascript_library.php http://www.readwriteweb.com/archives/google_ui_javascript_library.php Developers Thu, 05 Nov 2009 10:31:45 -0800 Marshall Kirkpatrick
Opera 10: A Pretty Good Browser, But Will Anybody Use It? opera_logo_dec08.pngAfter numerous betas and two release candidates, Opera today released the final version of Opera 10, the company's flagship desktop Internet browser. Users who skipped all the pre-release versions of Opera 10 will be pleasantly surprised with the updates that Opera has brought to its browser. These include Opera Turbo, the company's compression technology that makes surfing on slower connections more bearable, visual tabs, a smarter spell checker, and a faster rendering engine. Opera also still features a built-in email client and RSS reader.

]]>Sponsor

]]> Features

After testing Opera 10 for a while, it quickly becomes clear that it is a perfectly capable browser. It's got everything the majority of users would ever want, ranging from the 'speed dial' homepage to a sidebar for taking notes, which are synced between different machines, just like your bookmarks. There is a 'magic wand' that automatically fills in passwords from Opera 10's built-in password manager, mouse-gestures, real-time fraud protection, a BitTorrent client,  and the tabs now optionally show a rendered version of the page for a more visual experience. The 'visual tabs' can also be put into a sidebar, a nice feature in the age where vertical space is limited as users have moved to wide-screen displays.

Opera 10 is available for Windows, Mac, Linux, FreeBSD, Solaris.

Speed

In our informal tests, Opera 10 couldn't match Firefox, Safari 4, and Chrome in most benchmarks. On a MacBook, Safari finished the SunSpider JavaScript benchmark in 711ms while Opera needed over 5700ms. In daily use, however, these benchmarks tend to mean very little and we barely noticed any difference.

opera_10_large_sep09.jpg

Even though Opera has always been a good browser with a very passionate user base, it never quite caught on with mainstream users. Opera 10 is definitely Opera's best browser to date, but chances are that even this new version won't help Opera to gain a lot of market share as other browsers now have the momentum. However, if you haven't looked at Opera for a while, now is a good time to give it a try again. And if you often find yourself in a situation where you have to deal with a sluggish Internet connection (airports, hotels, etc.), Opera Turbo alone makes this a handy browser to have around, even if you don't make it your default browser.

]]>Discuss]]>
http://www.readwriteweb.com/archives/opera_10_a_pretty_good_browser_but_will_anybody_use_it.php http://www.readwriteweb.com/archives/opera_10_a_pretty_good_browser_but_will_anybody_use_it.php Browsers Tue, 01 Sep 2009 09:30:34 -0800 Frederic Lardinois
Mozilla Labs Launches TestSwarm: Crowdsourced JavaScript Testing testswarm_logo_aug09.pngTestSwarm is a new Mozilla Labs project that aims to give developers an easy way to quickly test their JavaScript code on multiple browser versions. According to John Resig, who originally initiated this project as a tool to support the jQuery team, today's methods of cross-browser JavaScript testing simply don't scale. As a solution, he proposed to crowdsource these tests and farm them out to the browsers that people are already running on their computers. If you want to contribute to the project as a tester, simply head over to TestSwarm.com and the site will tell you if your browser is currently needed.

]]>Sponsor

]]> TestSwarm is still in alpha and hasn't been added to the Mozilla Labs home page yet.

For developers, TestSwarm currently supports 7 operating systems, ranging from Windows 2000 to OS X 10.5. The project runs its tests on all the major browsers. Whenever an error occurs in a specific browser, TestSwarm will return detailed data about what exactly went wrong.

testswarm_large_clients.png

Currently, TestSwarm is testing a number of popular open-source JavaScript libraries that a lot of developers rely on, including jQuery, YUI, Dojo, MooTools, and Prototype. You can download and install TestSwarm on your own servers if you want to use it for your own project. The code is available here.

Future Plans

In the long run, the team plans to make it easier for developers to test their own code on Mozilla's TestSwarm architecture as well. The team also plans to give developers the option to run manual tests, where user interaction is needed.

How to Participate

If you want to help out, just head over to the TestSwarm site. If your browser is needed, a box with an invitation to join the project will appear. Just keep TestSwarm running in a tab and it will automatically ping the project's servers for new tests every 30 seconds.

You can find more details about how TestSwarm works in this screencast:

Test Swarm Walkthrough from John Resig on Vimeo.

]]>Discuss]]>
http://www.readwriteweb.com/archives/mozilla_labs_launches_testswarm_crowdsourced_javascript_testing.php http://www.readwriteweb.com/archives/mozilla_labs_launches_testswarm_crowdsourced_javascript_testing.php News Wed, 26 Aug 2009 10:19:31 -0800 Frederic Lardinois
Chrome Experiments: Google Launches New Site to Showcase the Power of Chrome and JavaScript chrome_experiments_logo_mar09.pngYesterday, Google announced a new beta version of Chrome, which features a significantly faster version of V8, Google's JavaScript engine. Today, Google also launched Chrome Experiments, which showcases JavaScript intensive games, apps, and visualizations. The site is obviously meant to highlight the power of the combination of V8 and Chrome, though quite a few of the apps should also work on Firefox, Safari and IE. In our tests, however, Chrome did indeed provide the best experience.

]]>Sponsor

]]> Chrome Experiments currently features 19 apps, and Google plans to constantly update the site with new experiments and encourages developers to submit their JavaScript apps for inclusion.

Note: If you want to live on the cutting edge, here are the instructions for enabling the Chrome Beta and Developer channels.

Some Highlights

Here are some of our favorite apps in the current Google Chrome Experiments line-up:

Social Collider

Social Collider might just be one of the coolest Twitter visualization tools we have seen in the recent past. Social Collider shows the connections between different Twitter users. You can use a user name or keyword to initiate Social Collider, but it can also be used to visualize current Twitter trends.

Note: Using Social Collider can be quite CPU intensive, but the results are definitely worth it.

Google Gravity

google_gravity.pngThis is an utterly useless experiment, but it shows off some of the surprising possibilities of using JavaScript together with the Box2D Physics Engine. After you have seen gravity take its toll on the Google homepage, also try to perform some searches.

Smalltalk

Smalltalk is another Chrome Experiment that uses the Twitter API to visualize real-time chatter on the Internet. Specifically, Smalltalk looks at comments about the weather in the US (sunny, foggy, windy, etc.). Besides JavaScript, Smalltalk also makes use of the canvas element in HTML5 and the jQuery framework.

BallDroppings

balldroppings_small.pngJosh Nimoy's BallDroppings is a cool little musical toy that has already been implemented in a number of other languages. Here is the JavaScript version. Just draw a few lines on the screen and see what happens.

]]>Discuss]]>
http://www.readwriteweb.com/archives/chrome_experiments_google_launches_new_site_to_sho.php http://www.readwriteweb.com/archives/chrome_experiments_google_launches_new_site_to_sho.php News Wed, 18 Mar 2009 14:00:04 -0800 Frederic Lardinois
Happy 3rd Birthday, jQuery jQuerylogo.jpgjQuery, a popular Javascript library that lets website developers do beautiful things with relative ease, is celebrating its 3rd birthday today with an announcement that the project has joined the non-profit Software Freedom Conservancy and the release of a new version.

Project participant Rey Bango points out on the blog Ajaxian today, "considering the churn rate for open source projects, [jQuery's 3rd birthday] is a monumental achievement."

]]>Sponsor

]]> jQuery started out as a side project of Mozilla Javascript Evangelist John Resig. It was released at a meeting of BarCamp New York and has won widespread support from everyone from Microsoft and Nokia to a wide range of independent designers.

What does jQuery do? Its tag line is "the write less, do more Javascript library" and it's a favorite of many developers working on cutting edge and visually dazzling designs. Want to see some examples? Check out our coverage of the crowd pleasing blog comment system Encouraged Commentary and Drew Douglas's The 20 Most Practical and Creative Uses of jQuery.

If you're a developer and you haven't tried out jQuery yet - you probably should. As Jennifer Stuart wrote when she finally did this Spring, "Why I didn't jump on this bandwagon sooner, I'm not sure, but I am kicking myself for it."

With the addition of the jQuery code to the nonprofit Software Freedom Conservancy, companies using the code are far more free from fear of lawsuits for using it. For details on that development and a number of new technical additions to jQuery, see the announcement on the jQuery blog.

]]>Discuss]]>
http://www.readwriteweb.com/archives/happy_3rd_birthday_jquery.php http://www.readwriteweb.com/archives/happy_3rd_birthday_jquery.php Developers Wed, 14 Jan 2009 09:55:23 -0800 Marshall Kirkpatrick
Javascript Hero: Some Awesome Friday Night Fun javascripthero.jpgWe usually write about serious things here at ReadWriteWeb but it's Friday night and we've got to make an exception for Javascript Hero. Note: We're hearing reports that the site doesn't work well in IE, just so you know. It's the work of developer rock star John Resig and was brought to our attention by Chris Messina (again).

We'd tell you about it, but we'd rather you just go play it. Particularly if you're a Guitar Hero fan. Then take this opportunity to make a mental reminder to check out what Resig does and what Messina finds, too.

]]>Sponsor

]]>
http://www.readwriteweb.com/archives/javascript_hero.php http://www.readwriteweb.com/archives/javascript_hero.php Mashups Fri, 29 Aug 2008 17:41:24 -0800 Marshall Kirkpatrick
SocialHistory.js: See Which Sites Your Users Visit With so many social media sites in circulation today, badge soup can become a real problem for web sites trying to squeeze the most out of their traffic. Everyone has a different set of core social media sites that they use -- from del.icio.us and Ma.gnolia, to Digg, Reddit, and Diigo, we all have our favorites. But appealing to your users' varied tastes often means an overwhelming sea of site badges that is both unattractive and ineffective. Web developer Aza Raskin has a solution based on a browser history leak introduced due to CSS.

]]>Sponsor

]]> "Not everyone uses Digg. You have to decide on which bookmarking site, if any, to dedicate your precious screen real-estate. It's a hard choice. If you choose poorly your reader won't vote," writes Raskin. "On the other hand, if you take the bird-shot approach, it overloads your reader with branded badge after branded badge. It turns your page into the village bicycle. Not pretty."

As a solution, Raskin devised SocialHistory.js, a handy bit of JavaScript code that detects which social media sites your users frequent. Armed with that information, you can display only the relevant badges to each user.

SocialHistory.js works by exploiting the feature in modern web browsers that automatically uses a different link color for visited links. The JavaScript loads up a bunch of links from a list of top social media sites in an iFrame and looks at which have been visited based on the change in link color. From there, it can assume which you are most likely to use (or in my case, which I may have visited recently while doing research for a story).

Raskin notes that the same browser leak can be exploited using his bit of JavaScript to check out what other sites your users are visiting. You could ask SocialHistory.js to load up a list of competitor's web sites, for example, to see how much of your web site audience overlaps.

There are some drawbacks to the approach. For example, your users need to have JavaScript enabled (95% of people according to W3Schools), and the detection only works for sites that the user has visited recently (dependent on his or her history settings). Nonetheless, it is a clever way to clean up the badge overload on your site and find out a little bit about your visitors' surfing habits.

]]>Discuss]]>
http://www.readwriteweb.com/archives/socialhistoryjs_see_which_site.php http://www.readwriteweb.com/archives/socialhistoryjs_see_which_site.php Products Wed, 28 May 2008 08:04:29 -0800 Josh Catone
Facebook Releases Open Source JavaScript Library Facebook has long been a big contributor to the open source movement, and releases a number of their in-house projects under open source licenses. They even provide a a mirror for popular open source endeavors, such as Mozilla and Apache. This week Facebook announced the release their first open source JavaScript library.

]]>Sponsor

]]> In September, Facebook released FBJS, which is a layer on top of JavaScript designed specifically for use with the Facebook platform. It lets developers use JavaScript in their Facebook applications, including things like AJAX and DOM manipulation. The problem with FBJS, though, was that it didn't play nice with outside JavaScript libraries, so for anything that it didn't support, developers were out of luck.

With that in mind, Facebook decided to internally develop a library for creating JavaScript animations in FBJS. "And then we thought: 'why stop there?' The library had very little Facebook-specific code, so we took some time to modularize it, and now we're open-sourcing it for everyone," said Facebook developer Marcel Laverdet.

Facebook is following in the steps of rival web giants Google and Yahoo!, who both have open sourced internal JavaScript libraries. While Facebook's release of the animation library is a far cry from the more complete libraries released by Yahoo! and Google, such as Yahoo!'s YUI or Google's Web Toolkit, it is a step in that direction. Releasing open source development libraries is a very smart thing to do, because it builds capital with developers and attracts developers to your platform. For Yahoo! and Google, their development libraries help to attract developers to their other APIs (such as Google Maps or Flickr). For Facebook, releasing libraries like Animation could help draw more developers toward their platform.

The Animation library is described as a way for developers to create "customizable animations using CSS and DOM manipulation." It is released under a modified BSD license.

]]>Discuss]]>
http://www.readwriteweb.com/archives/facebook_releases_javascript_library.php http://www.readwriteweb.com/archives/facebook_releases_javascript_library.php Facebook Thu, 17 Jan 2008 10:36:15 -0800 Josh Catone