Welcome!

AJAX & REA Authors: Elizabeth White, Trevor Parsons, ChandraShekar Dattatreya, Liz McMillan, David H Deans

Related Topics: Web 2.0, AJAX & REA

Web 2.0: Article

Has Web Development Lost Its Way?

Introducing an open source Java AJAX component based web application development framework

To understand where web development is going, we need a brief review of web development history. Many years have gone since the old CGI bridge was invented, a quick hack to achieve the impossible, create server-based web applications. The first CGI based web applications were C (and Perl) programs based on a terrific mix of HTML and printf calls. This primitive approach was valid to build those "magic" dynamic web pages constructed with our data introduced with forms. This was the starting point of a race to improve the developer tools and the user experience. The live web starts here.

A bit later, Allaire's ColdFusion brought us a new way to build our primitive web applications, the HTML based templating (disclaimer: I'm not claiming Allaire invented web templating, but this technique was very popular thanks to ColdFusion). The HTML page was again the protagonist but mixed with a scripting language, the "Server Page" paradigm. Microsoft of course entered the web scene pressed by the Netscape and Allaire success, the fear of losing ground in business is a very strong reason to innovate, and they gave us ASP technology to compete with the successful ColdFusion, including the Visual Basic Script as the script language.

Years later the Java world put its foot in the server side with the expected logical path, servlets (a CGI Java version) and JSP (the ASP competitor) introducing Java in the web server. Model 1 was born.

Model 1 had a downside: too much code mixed with markup, so the custom-tag invention starts to shine. The custom-tag technique opens the door to two new protagonists, XML-based programming and expression languages (EL). XML + EL are the "weak" replacement of the typical strong full featured and verbose programming language used before to manage the dynamic parts of the markup, reducing (slightly) the impedance of both worlds and promoting an improved separation of business code and view. They brought a need to bridge page templates and business code... the "bindings."

The next step: why does the view decide the navigation, the target view? The answer to this question is the adaptation of the MVC pattern to the web. In Java the most popular MVC framework, Struts, defines the navigation rules using again XML, in this case the "XML metaprogramming" is not to develop the view, is the MVC glue.  Model 2 was born.


The Birth of the Event-Based Web

Model 2 introduced desktop culture in the web. The temptation is near, and the temptation is called "components". HTML form components are very basic and the HTML/W3C world is very conservative to welcome something new. But we need new desktop-like drag and drop components beyond form controls...now! The answer is HTML and JavaScript generated by tools. How to package? How to bind with the business code? The Java answer is JSF with more custom tags, more XML files, metaprogramming and Java bindings, and a "new kid on the block" in the server centric world, JavaScript. The server generates and sends to the client custom JavaScript, usually with support of client JavaScript libraries, as the way to add desktop-like behavior to the components and to drive user events to the server reloading the page with the new visual state of the component when necessary. The event-based web was born.

Now AJAX is here, what can we do? Umm... we can generate more custom JavaScript or XML, transporting the data from the server and render this data in the client using JavaScript centric components, or we can build the component view in the server and generate the necessary custom JavaScript from the server to change the appearance of the component in the client as response of user actions.

So what is wrong with this path?

1) Custom tags (with custom HTML and JavaScript generation): violates web development culture

In the desktop a program's appearance can be fully customized because the developer usually has a pixel-based level. You can build your custom controls from scratch but it is usually a hard task. The web space is very different, there is not so much power (for instance there is no API to draw on) but is not difficult to customize the visual appearance of your web application using tags, CSS, and JavaScript. For instance, almost all Swing applications use the default "boring" controls, in web applications every <table> is different and there is no steep learning curve.

Traditionally when a web developer fills a <table> with data the developer usually has full control of the <table> layout. This full control is being lost with so many intrusive custom-tag based tools. These custom tags usually "replace" the web designer, generating tons of obscure markup mixed with JavaScript. There are two problems: corporate style may be not fulfilled and complex components are not possible. With simple components this approach may be valid because the CSS has some control of the visual appearance, but with complex components like composite components you are in trouble.

2) XML based metaprogramming: disturbs the Object Oriented Programming paradigm

XML is very nice for custom configuration but it is verbose and very poor when used as a pseudo imperative language. The current tendency to use declarative programming underuses the power of OOP because this XML-based declarative programming is usually being used in an architectural manner (with a deep architectural impact). For instance, is very hard in XML to declare a feature applying to different levels (globally, locally) or to groups ("batch" configuration). Most of the time you need to repeat the same again and again because the XML format used impose it.

Custom-tags and XML-centric frameworks are usually designed with tools in mind. Tools increase productivity of course, but the most productive tool is reuse, and OOP strongly promotes reusing easily, with XML-based components it is very hard to reuse your own work because you need to build your own XML-based components otherwise you will be repeating the same again and again.

3) Old tools do not fit with AJAX

Most of the server-based web frameworks were designed before the AJAX explosion. Many page-based frameworks are not very useful in the AJAX space, because a web application with 100 pages can be replaced with a new one with only 1 page, classical navigation utilities are underused with AJAX. This applies to the pre-AJAX component (or event) based frameworks too; these frameworks tried to simulate a desktop application using classical navigation with full page reload, the sophisticated techniques used to keep track of the component state while the user navigates, including back and forward button support, are now over-engineering.

Is there some other alternative?

Yes.

The design problem of classical web application development is mainly in the view. The view is defined as plain text, this text is never exposed as a DOM tree to the developer, so any binding to business code, declarations, region marks etc are always done in the markup with special tags, regular expressions etc. Because the normal HTML is treated as plain text only the special tags and regular expressions are the live elements of the page. Components are usually defined with custom tags because it is extremely difficult to delegate the markup design to the developer because the developer needs to explain to the framework how the markup design fits in the expected component behavior defined by the framework.

The alternative is to repeat the nature of the client in the server, use again the old DOM in the server too, we are in the twenty-first century and in the AJAX era where there is no need to rebuild complete pages by any user click. Many years ago this approach had many problems, but these problems are gone; furthermore the problem of the expensive memory use of the DOM can be surpassed using serialization as plain text of the "static subtrees."

 ItsNat Simulates a Java W3C Browser in the Server

I am the author of ItsNat, an open source Java AJAX Component based web application development framework. ItsNat uses the approach described above. This approach is radically new but uses the old tools: the client DOM tree is repeated in the server as a Java W3C DOM tree, exactly the opposite, the client DOM is a clone of the server DOM, if the server DOM changes the client DOM is updated automatically by the framework usually as response of user action, this user action is received as a Java W3C DOM Event transported by AJAX. In short, ItsNat simulates a Java W3C browser in the server.

With this approach the starting page may be defined as a pure HTML template, and exposed to the developer as a DOM tree. With a DOM tree the developer has absolute control of the layout including minor changes as the response of an AJAX event. If an AJAX event requires a big change of the page a pure HTML fragment can be loaded converted to DOM and inserted in the document.

How to build components? Following the Wicket approach but with the DOM side, defining patterns and telling the framework what is the parent element of a list, table, tree etc what is the pattern of a list item, row, cell, tree node... what is the component structure, in short, attaching the developer defined view to the component. Then component will clone the pattern to create new list items, rows, cells and tree nodes.

Conclusion: returning to its roots may be the path to the future in web development.

More Stories By Jose M. Arranz

Jose M. Arranz, the author of ItsNat, is CEO and co-founder of Innowhere Software Services S.L.

Comments (3) View Comments

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.


Most Recent Comments
Jose M. Arranz 11/26/07 03:58:15 AM EST

I agree with you Eelco. ItsNat has support of classical (page based) navigation, the pure HTML templating, and direct DOM manipulation and components (with no events) are valid too without AJAX events, but is not the framework focus. In fact AJAX may be used to assist classic navigation I named it "referrers", I think this technique may be used in any framework with AJAX support, of course... Wicket!

Thanks for your support :)

Note: there is a "bug" in the article (the bug is mine course) "regular expressions" should be "expression languages".

Eelco Hillenius 11/25/07 11:31:35 PM EST

I agree with a page-navigation centric approach being a bad fit with Ajax, at least sometimes. However, a framework like Wicket lets you build a single page web app even without Ajax if you want (using component replacement and panels). Also, pages aren't always bad. They can serve as units for bookmarking, and in general units to divide work/ functionality. I think the way you can mix the two approached together with Wicket works well.

You propose kind of the inverse of this, which sounds equally good to me. Good luck with the project :-)

backtothefuture 11/25/07 02:03:57 PM EST

> Conclusion: returning to its roots may be the
> path to the future in web development.

Amen

@CloudExpo Stories
ScriptRock makes GuardRail, a DevOps-ready platform for configuration monitoring. Realizing we were spending way too much time digging up, cataloguing, and tracking machine configurations, we began writing our own scripts and tools to handle what is normally an enormous chore. Then we took the concept a step further, giving it a beautiful interface and making it simple enough for our bosses to understand. We named it GuardRail after its function - to allow businesses to move fast and stay sa...
SYS-CON Events announced today that Cloudian, Inc., the leading provider of hybrid cloud storage solutions, will exhibit at SYS-CON's 16th International Cloud Expo®, which will take place on June 9-11, 2015, at the Javits Center in New York City, NY. Cloudian, Inc., is a Foster City, California - based software company specializing in cloud storage software. The main product is Cloudian, an Amazon S3-compliant cloud object storage platform, the bedrock of cloud computing systems, that enables c...
SYS-CON Media announced today that Sematext launched a popular blog feed on DevOps Journal with over 6,000 story reads over the weekend. DevOps Journal is focused on this critical enterprise IT topic in the world of cloud computing. DevOps Journal brings valuable information to DevOps professionals who are transforming the way enterprise IT is done. Sematext is a globally distributed organization that builds innovative Cloud and On Premises solutions for performance monitoring, alerting an...
Leysin American School is an exclusive, private boarding school located in Leysin, Switzerland. Leysin selected an OpenStack-powered, private cloud as a service to manage multiple applications and provide development environments for students across the institution. Seeking to meet rigid data sovereignty and data integrity requirements while offering flexible, on-demand cloud resources to users, Leysin identified OpenStack as the clear choice to round out the school's cloud strategy. Additional...
SYS-CON Events announced today that Windstream, a leading provider of advanced network and cloud communications, has been named “Silver Sponsor” of SYS-CON's 16th International Cloud Expo®, which will take place on June 9–11, 2015, at the Javits Center in New York, NY. Windstream (Nasdaq: WIN), a FORTUNE 500 and S&P 500 company, is a leading provider of advanced network communications, including cloud computing and managed services, to businesses nationwide. The company also offers broadband, p...
The BPM world is going through some evolution or changes where traditional business process management solutions really have nowhere to go in terms of development of the road map. In this demo at 15th Cloud Expo, Kyle Hansen, Director of Professional Services at AgilePoint, shows AgilePoint’s unique approach to dealing with this market circumstance by developing a rapid application composition or development framework.
SYS-CON Events announced today Isomorphic Software, the global leader in high-end, web-based business applications, will exhibit at SYS-CON's DevOps Summit 2015 New York, which will take place on June 9-11, 2015, at the Javits Center in New York City, NY. Isomorphic Software is the global leader in high-end, web-based business applications. We develop, market, and support the SmartClient & Smart GWT HTML5/Ajax platform, combining the productivity and performance of traditional desktop software ...
In high-production environments where release cycles are measured in hours or minutes — not days or weeks — there's little room for mistakes and no room for confusion. Everyone has to understand what's happening, in real time, and have the means to do whatever is necessary to keep applications up and running optimally. DevOps is a high-stakes world, but done well, it delivers the agility and performance to significantly impact business competitiveness.
"Our premise is Docker is not enough. That's not a bad thing - we actually love Docker. At ActiveState all our products are based on open source technology and Docker is an up-and-coming piece of open source technology," explained Bart Copeland, President & CEO of ActiveState Software, in this SYS-CON.tv interview at DevOps Summit at Cloud Expo®, held Nov 4-6, 2014, at the Santa Clara Convention Center in Santa Clara, CA.
The Internet of Things is not new. Historically, smart businesses have used its basic concept of leveraging data to drive better decision making and have capitalized on those insights to realize additional revenue opportunities. So, what has changed to make the Internet of Things one of the hottest topics in tech? In his session at @ThingsExpo, Chris Gray, Director, Embedded and Internet of Things, discussed the underlying factors that are driving the economics of intelligent systems. Discover ...
"BSQUARE is in the business of selling software solutions for smart connected devices. It's obvious that IoT has moved from being a technology to being a fundamental part of business, and in the last 18 months people have said let's figure out how to do it and let's put some focus on it, " explained Dave Wagstaff, VP & Chief Architect, at BSQUARE Corporation, in this SYS-CON.tv interview at @ThingsExpo, held Nov 4-6, 2014, at the Santa Clara Convention Center in Santa Clara, CA.
The major cloud platforms defy a simple, side-by-side analysis. Each of the major IaaS public-cloud platforms offers their own unique strengths and functionality. Options for on-site private cloud are diverse as well, and must be designed and deployed while taking existing legacy architecture and infrastructure into account. Then the reality is that most enterprises are embarking on a hybrid cloud strategy and programs. In this Power Panel at 15th Cloud Expo (http://www.CloudComputingExpo.com...
Verizon Enterprise Solutions is simplifying the cloud-purchasing experience for its clients, with the launch of Verizon Cloud Marketplace, a key foundational component of the company's robust ecosystem of enterprise-class technologies. The online storefront will initially feature pre-built cloud-based services from AppDynamics, Hitachi Data Systems, Juniper Networks, PfSense and Tervela. Available globally to enterprises using Verizon Cloud, Verizon Cloud Marketplace provides a one-stop shop fo...
SYS-CON Events announced today that IDenticard will exhibit at SYS-CON's 16th International Cloud Expo®, which will take place on June 9-11, 2015, at the Javits Center in New York City, NY. IDenticard™ is the security division of Brady Corp (NYSE: BRC), a $1.5 billion manufacturer of identification products. We have small-company values with the strength and stability of a major corporation. IDenticard offers local sales, support and service to our customers across the United States and Canada...
The move in recent years to cloud computing services and architectures has added significant pace to the application development and deployment environment. When enterprise IT can spin up large computing instances in just minutes, developers can also design and deploy in small time frames that were unimaginable a few years ago. The consequent move toward lean, agile, and fast development leads to the need for the development and operations sides to work very closely together. Thus, DevOps become...
SYS-CON Events announced today that AIC, a leading provider of OEM/ODM server and storage solutions, will exhibit at SYS-CON's 16th International Cloud Expo®, which will take place on June 9-11, 2015, at the Javits Center in New York City, NY. AIC is a leading provider of both standard OTS, off-the-shelf, and OEM/ODM server and storage solutions. With expert in-house design capabilities, validation, manufacturing and production, AIC's broad selection of products are highly flexible and are conf...

ARMONK, N.Y., Nov. 20, 2014 /PRNewswire/ --  IBM (NYSE: IBM) today announced that it is bringing a greater level of control, security and flexibility to cloud-based application development and delivery with a single-tenant version of Bluemix, IBM's

AppZero has announced that its award-winning application migration software is now fully qualified within the Microsoft Azure Certified program. AppZero has undergone extensive technical evaluation with Microsoft Corp., earning its designation as Microsoft Azure Certified. As a result of AppZero's work with Microsoft, customers are able to easily find, purchase and deploy AppZero from the Azure Marketplace. With just a few clicks, users have an Azure-based solution for moving applications to the...
“In the past year we've seen a lot of stabilization of WebRTC. You can now use it in production with a far greater degree of certainty. A lot of the real developments in the past year have been in things like the data channel, which will enable a whole new type of application," explained Peter Dunkley, Technical Director at Acision, in this SYS-CON.tv interview at @ThingsExpo, held Nov 4–6, 2014, at the Santa Clara Convention Center in Santa Clara, CA.
The cloud is becoming the de-facto way for enterprises to leverage common infrastructure while innovating and one of the biggest obstacles facing public cloud computing is security. In his session at 15th Cloud Expo, Jeff Aliber, a global marketing executive at Verizon, discussed how the best place for web security is in the cloud. Benefits include: Functions as the first layer of defense Easy operation –CNAME change Implement an integrated solution Best architecture for addressing network-l...