BT

New Early adopter or innovator? InfoQ has been working on some new features for you. Learn more

Yahoo! Open Sources Mojito, a JavaScript Framework Promising Write Once, Run Anywhere

| by Abel Avram Follow 4 Followers on Apr 03, 2012. Estimated reading time: 2 minutes |

Yahoo! has open source Mojito, a framework for creating reusable widgets incorporated in various web applications and executed either on the client or the server-side without code change.

Yahoo! seems to be on an open sourcing spree. After recently opening up YSlow, Yahoo! has decided to open source Mojito, a JavaScript web framework for building MVC web applications. Mojito is part of Yahoo! Cocktails, a JavaScript platform enabling writing web application code that runs on multiple devices – PCs, tablets, smartphones, etc.- without having to port the code to each device and form factor. The other major component of Yahoo! Cocktails is Manhattan, a server-side JavaScript environment for running Mojito apps in the cloud. At the bottom of this platform stands the YUI (Yahoo! User Interface) Library, another open source framework providing a common set of APIs for running JavaScript web apps across all major browsers and devices, including server-side environments.

The main goal of Yahoo! Cocktails is to provide support for creating web applications made of reusable components that can be displayed by various devices, and executed either on the browser-side or on the server-side. The platform uses just HTML5, JavaScript and CSS.

Mojito is a presentation-centric framework. The basic element is a Mojit – a Mojito widget, an MVC component that can be deployed as part of different web applications. When creating a Mojito-based app, developers will be able to put together widgets created by other developers. One example of such an app is Yahoo! OMG where each component of the page is such a widget. Before being rendered, the widgets are skinned to take the desired look and feel. One could imagine even a market for such widgets in the future.

One of the essential characteristics of Mojito is that widgets are device agnostic. Mojits can be displayed on any desktop or mobile device with a major browser, while their controller code can be executed either on the client or on the server on top of Node.js. So, developers don’t need to write separate code for the client and the server, the same code being runnable on either side.

Yahoo! wants to enhance Mojito further to introduce mechanisms that transparently switch code execution between the client and the server as the need arises. For example, if a device is too slow for certain processing, the code will be sent for execution on the server without having to be specified by the developer or having the user interact with the app.

Mojito runs on top of YUI3 which is used for dependency management, but Mojito is not bound to YUI3, and it can run on top of jQuery or DOJO. YUI3 has been chosen because it runs on any major browser and also on Node.js.

Mojito is currently used by Yahoo! for Livestand, Fantasy Finance and Fantasy Premier League Football.

Mojito code is available on GitHub under a BSD license. The presentation Mojito: A Tale of Two Runtimes explains in low level detail how Mojito widgets are created and executed.

Rate this Article

Adoption Stage
Style

Hello stranger!

You need to Register an InfoQ account or or login to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Tell us what you think

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread
Community comments

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Discuss

Login to InfoQ to interact with what matters most to you.


Recover your password...

Follow

Follow your favorite topics and editors

Quick overview of most important highlights in the industry and on the site.

Like

More signal, less noise

Build your own feed by choosing topics you want to read about and editors you want to hear from.

Notifications

Stay up-to-date

Set up your notifications and don't miss out on content that matters to you

BT