Ractive aims to bring Web programming to the masses

Ractive aims to bring Web programming to the masses

The Ractive JavaScript library is designed to simplify the process of creating dynamic Web pages

Ractive.js comes with a set of tutorials aimed to get JavaScript novices who to use the library

Ractive.js comes with a set of tutorials aimed to get JavaScript novices who to use the library

The developers of a JavaScript library for building interactive user interfaces are hoping their work will make Web programming more accessible for part-time programmers.

The library, Ractive.js, provides a set of capabilities typically found in complex Web application frameworks, which require a fair amount of expertise to manage, said Rich Harris, one of the creators of Ractive and a digital journalist at the British newspaper The Guardian.

Harris, who presented the technology at the Association for Computing Machinery's Applicative conference in New York, demonstrated the capabilities of Ractive and discussed the current state of tools for building Web sites, which he described as too abstract and complex for non-programmers wanting to create their own sites.

"Web development has gotten too complicated," Harris said. "We should all want a world in which everyone can participate in the Web as a creator, not just publish text and images on someone else's platform, but be able to create rich, interactive Web experiences."

The original promise of the World Wide Web was that anyone could set up a Web site, using basic HTML, he said. While HTML still provides a basic foundation for posting text and images, advanced programmatic capabilities have not been not been made as readily accessible to the novice, Harris said.

While Ractive aims to lower the entry barrier to Web programming, it may still be beyond the reach of non-programmers. However, it could be intuitive for someone with a bit of experience with basic HTML and JavaScript.

Using Ractive, the programmer can tap into a wide range of functionality that would otherwise be too laborious to code by hand. Web pages can be automatically updated with data that is personalized to the user, or even supplied by the user. Ractive also allows the user to insert business logic into the Web page, for example to hide or show part of a Web page depending on the user's preference.

In many cases, Web sites with such functionality use frameworks such as Ruby on Rails or Django for Python, which are built on a Model View Controller (MVC) architecture. MVC stresses a "separation of concerns" whereby the user presentation of Web site is managed separately from the data and the logic.

While MVC can help manage large sprawling Web operations, the resulting code base can be difficult to fully comprehend, even for experienced programmers, Harris said. MVC codebases also gets brittle over time, meaning that they could break easily if changes are made, he noted.

Other JavaScript libraries, such as jQuery or Angular.js, also provide ways to work with user data on Web sites, though using them can lead to unstructured code that is difficult to manage. In jQuery's case, this is often called "spaghetti code."

Funded in part by the Bill and Melinda Gates Foundation, Ractive was developed so that it could be used by programming novices.

The library does not require external dependencies, or other programs that must be in place before the program can be used. The Ractive site has a set of tutorials, with code that can be easily copied and reused. Extra work was taken to craft error messages so they make sense, and link to further documentation online.

Ractive has already found a place in some large-scale Web sites. The Yellow Pages, the National Football League and the French Finance firm AXA have used the library for various tasks. It also is used for most of the Guardian's own interactive graphics.

In technical terms, Ractive provides the ability for the programmer to create a set of templates that can be dynamically populated with data or logic. It acts as a virtual DOM (Document Object Model), or an intermediary to the browser's own DOM, which the browser uses to parse HTML.

Ractive is not the only template-based JavaScript library using this approach. Meteor.js and the latest update to Handlebars.js use approaches similar to Ractive. "To me, that means it is an idea that makes sense," Harris said.

Joab Jackson covers enterprise software and general technology breaking news for The IDG News Service. Follow Joab on Twitter at @Joab_Jackson. Joab's e-mail address is

Join the CIO Australia group on LinkedIn. The group is open to CIOs, IT Directors, COOs, CTOs and senior IT managers.

Join the CIO newsletter!

Error: Please check your email address.

Tags Development toolsapplication developmentThe GuardianWeb services developmentBill and Melinda Gates Foundationsoftware

More about BillBill and Melinda Gates FoundationIDGNational Football LeagueNewsYellow Pages

Show Comments

Market Place