<<

This is an electronic reprint of the original article. This reprint may differ from the original in pagination and typographic detail.

Author(s): Laine, M., Shestakov, ., Litvinova, E., and Vuorimaa, P. Title: Toward Unified Web Application Development

Year: 2011 Version: Final published version Please cite the original version: Laine, M., Shestakov, D., Litvinova, E., and Vuorimaa, P. (2011). Toward Unified Web Application Development. IT Professional, 13(5), 30-36. DOI: 10.1109/MITP.2011.55

Rights: © 2011 IEEE. Reprited, with permission, from Laine, M., Shestakov, D., Litvinova, E., and Vuorimaa, P. (2011). Toward Unified Web Application Development. IT Professional, 13(5), 30-36. DOI: 10.1109/MITP.2011.55

In reference to IEEE copyrighted material which is used with permission in this dissertation, the IEEE does not endorse any of [university/educational entity's name goes here]'s products or services. Internal or personal use of this material is permitted. If interested in reprinting/republishing IEEE copyrighted material for advertising or promotional purposes or for creating new collective works for resale or redistribution, please go to http://www.ieee.org/publications_standards/publications/rights/rights_link. to learn how to obtain a License from RightsLink.

This publication is included in the electronic version of the article dissertation: Laine, Markku. Unified Web Application Development - A Declarative Approach to Empower End-User Developers. Aalto University publication series DOCTORAL DISSERTATIONS, 6/2018.

All material supplied via Aaltodoc is protected by copyright and other intellectual property rights, and duplication or sale of all or part of any of the repository collections is not permitted, except that material may be duplicated by you for your research use or educational purposes in electronic or print form. You must obtain permission for any other use. Electronic or print copies may not be offered, whether for sale or otherwise to anyone who is not an authorised user.

Powered by TCPDF (www.tcpdf.org) THE FUTURE OF WEB APPS

Toward Unifi ed Web Application Development

Markku Laine, Denis Shestakov, Evgenia Litvinova, and Petri Vuorimaa, Aalto University School of Science

Web application development in the context of the conventional three-tier architecture is complex, typically requiring a team of experts. Recent Web application architectures and frameworks simplify the development process, potentially turning tier-specific experts into one-person developer teams.

raditional Web application develop- Classification of Programming ment requires a good understanding Languages of heterogeneous systems, program- Numerous programming languages have been T ming languages, concepts, and frame- developed over the years. One way of better un- works. For example, in a Web application based derstanding their similarities and differences is on the conventional three-tier architecture,1 the to classify them into a hierarchy of paradigms presentation (user interface), logic (server), and based on their computation model. Typically, data (data management) tiers are all authored top-level classification comprises two paradigms— using conceptually different programming imperative (such as , , and JavaScript) and languages.2 declarative (such as CSS, HTML, and SQL)— Novel Web application architectures have which we can further divide into subparadigms, emerged that aim to reduce this complexity as shown in Figure 1.3 by expanding the concepts used on a single The main difference between the two top-level tier to cover all three tiers. In addition to re- paradigms is that declarative languages specify ducing the amount of required knowledge and what a program should do (the desired results), simplifying the development process, these ar- rather than how to do it (the algorithms needed chitectural approaches also allow tier-specific to achieve the results). This higher abstrac- experts to author an entire Web application on tion level makes declarative languages easier their own. to reason about and raises their semantic level.

30 IT Pro September/October 2011 Published by the IEEE Computer Society 1520-9202/11/$26.00 © 2011 IEEE Programming language paradigms Imperative languages, on the other hand, have more expressive power Imperative Declarative but are generally harder to use and understand.4 This classification of Object- Parallel top-level paradigms isn’t absolute Procedural Logic Functional Database though—some programming lan- based processing guages are more declarative than • C • Java • Java • Prolog • Lisp • SQL others, and some even support multi- ple paradigms. Figure 1. A hierarchy of programming language paradigms (based 3 Another notable difference be- on Doris Appleby and Julius VandeKopple’s work ). The top-level tween imperative and declarative lan- classification comprises two paradigms—imperative and declarative. guages is their scope of use. Typically, imperative languages (such as C and Java) are more general-purpose and applicable for data tiers) makes the development process more solving a variety of problems, whereas declara- complex.5 tive languages are more applicable for solving One way of simplifying the development domain-specific problems, such as defining the process is to expand what is normally used on structure (HTML) or styling (CSS) of a webpage, a single tier to cover all three tiers. An author or managing data (SQL) stored in a relational could also select a single programming language database. This, of course, makes a certain de- and paradigm (imperative or declarative) from a clarative language a good fit for solving the prob- specific tier to use throughout the entire Web lems for which it was specifically designed and a application. poor fit for others because it lacks expressiveness in that domain. Expanding the Presentation Tier: XFormsDB The Evolution of Web A Web designer working on the presentation tier Application Architectures is, as a rule, familiar with declarative XHTML As Figure 2a shows, authors (that is, Web de- and CSS but not skillful in the server-side aspects signers, Web developers, and database experts) of a Web application. Such an expert can ben- implement a typical Web application’s presenta- efit from an architectural approach expanding tion tier using declarative XHTML, combined a presentation-centric language with common with imperative JavaScript to provide additional server-side and database-related functionality. interactivity. They implement the application XFormsDB (developed by Markku Laine, http:// logic residing on the server side using an object- code.google.com/p/xformsdb) is an example of oriented imperative language, such as Java, Ruby, presentation-centric architectural expansion.6 or PHP. They carry out communication between The idea behind the declarative XFormsDB these two tiers using declarative formats (for ex- markup language7 is to naturally extend XForms ample, XML or JSON—JavaScript Object No- (see the sidebar) with the most common server- tation) and the Ajax technique. Finally, on the side and database-related functionality (see undermost tier of the application—that is, the Figure 2b) so authors no longer have to resort data tier—they use either an object-relational to imperative client-side scripting or server-side mapping (ORM) or declarative SQL programming languages. To manage the data statements to manage data stored in a relational stored in data sources, XFormsDB uses de- database. clarative XPath, but it also lets authors use the The problem with this conventional archi- declara tive XQuery to execute more complex que- tecture is that it requires different tier-specific ries (see the sidebar). The XFormsDB framework experts because of the various programming is bundled with the Apache Tomcat Web server, languages, programming paradigms, and data the eXist-db native XML database,8 and the models on each tier. In addition, the partition- Orbeon Forms Ajax-based server-side XForms pro- ing of a Web application between the client cessor, which can transform requested webpages (presentation tier) and the server (logic and into cross-browser JavaScript and HTML files.

computer.org/ITPro 31 THE FUTURE OF WEB APPS

XHTML+ Presentation XML XForms

XForms Logic XML

XForms Presentation Data XML (XPath)

(b) XML+ XHTML+ Presentation JavaScript JSON XHTML+ Presentation Object- Java oriented

Object- Object- Java/Ruby/PHP Logic Logic Java Logic oriented oriented

Java Object- Data (ORM) oriented SQL/ORM Data Relational (c)

(a) Data XHTML+ Presentation XML XQuery

XQuery Logic XML

XQuery Data XML

(d)

Figure 2. Presentation, logic, and data-centric approaches for expanding (a) the conventional three-tier Web application architecture. Different Web application frameworks exist for each tier: (b) XFormsDB expands the presentation tier, (c) the is for the logic tier, and (d) Sausalito expands the data tier. For each architecture, technologies appear on the left and data models are on the right.

Expanding the Logic Tier: imperative Java—beyond its intended scope so The Google Web Toolkit that it can be used not only to author the server- A Web developer working on the logic tier pos- side application logic but also a Web application sesses excellent technical knowledge but doesn’t user interface (see Figure 2c). (Authors could necessarily have the need or motivation to imple- also use XHTML to create the user interface). ment a fancy user interface for a Web application. When a GWT-based Web application is deployed, A logic-centric approach based on an impera- the GWT Java-to-JavaScript compiler translates tive, general-purpose programming language the user interface code written in Java into cross- is the most attractive option in this case. In browser JavaScript and HTML files, thus mak- 2006, Google introduced its Google Web Tool- ing it possible to create complex Ajax-style Web kit (GWT, http://code.google.com/webtoolkit), applications in Java. which became one of the first modern frame- This approach also supports the execution works for this approach. of the same application code on both the client GWT aims to expand a general-purpose pro- and server side, increasing the code’s reusabi- gramming language—namely, object-oriented lity.5 Furthermore, using GWT with an ORM

32 IT Pro September/October 2011 XForms and XQuery

ere we introduce two W3C recommendations documents or any data source that can be viewed as H for declarative Web application development. XML, such as relational databases.2 XQuery extends XPath, another W3C recommended query language, XForms: An XML Form Language by introducing additional functionality, such as data XForms, a W3C recommendation since October 2003, grouping and sorting as well as cross-document is an XML-based Web forms technology and the suc- joins. cessor to HTML forms.1 It was designed to tackle the most common problems found in HTML forms (for References example, dependency on imperative scripting lang- 1. J.M. Boyer, XForms 1.1, World Wide Web Consortium uages, such as JavaScript) and to ease the authoring (W3C) recommendation, Oct. 2009; www.w3.org/TR/ of dynamic Web forms. xforms. XQuery: An XML Query Language 2. S. Boag et al., XQuery 1.0: An XML Query Language XQuery is a powerful query language designed by (2nd ed.), World Wide Web Consortium (W3C) W3C for extracting and manipulating data from XML recommendation, Dec. 2010; www.w3.org/TR/xquery. library, such as Hibernate, to manage data lets an From Theory to Practice author implement an entire Web application using We evaluated these three Web application frame- only Java. works to obtain a high-level overview and consi- der their advantages and drawbacks. We focused Expanding the Data Tier: Sausalito on eight software product quality characteristics Database experts have special needs for design- that are part of the ISO/IEC 25010:2011 stan- ing and developing Web applications. For exam- dard.9 However, because the standard isn’t spe- ple, they might need to implement a simple user cifically designed to evaluate Web application interface to handle and analyze available data. To frameworks, we included two additional charac- use their existing knowledge, they need a devel- teristics: time-to-market10 and support (that is, opment approach based on concepts commonly documentation quality, development community used on the data tier. The Sausalito XQuery appli- activity, and development tool availability). cation server (www.28msec.com) provides such a data-centric approach by extending a query Functional Suitability language’s capabilities to cover the most com- Sausalito and especially GWT provide rich func- mon client-side and server-side functionality (see tionality for developing enterprise-level Web appli- Figure 2d). cations with complex business logic. XFormsDB’s Sausalito uses declarative XQuery as the base functionality covers only the most common language for developing full-fledged Web appli- server-side and database-related tasks, because cations. In Sausalito, a database expert can au- the framework targets Web designers whose main thor a Web application’s presentation tier using focus isn’t on the application’s business logic. declarative XHTML combined with declara- tive XQuery, instead of having to resort to im- Reliability perative JavaScript. Sausalito uses XQuery on all GWT, the oldest and most mature of the three three tiers, so the database expert can use the frameworks, has been widely adopted around the same XQuery code on the server side as well. world, and many public Google products, such as When a webpage is requested, the Zorba Google AdWords, use it. On the contrary, both XQuery processor executes the XQuery server- XFormsDB and Sausalito were developed as aca- side code before sending the webpage to the cli- demic projects, though a start-up company was ent. On the client side, XQuery in the Browser recently established to commercialize Sausalito. (XQiB)—which provides browser-related XQuery The reliability of both frameworks has been tested extensions and includes a JavaScript-based on numerous Web applications. MXQuery XQuery processor—interprets and executes the remaining XQuery code. Sausalito Security comes bundled with an integrated Web, appli- XFormsDB provides built-in and easy-to- cation, and database server. use security capabilities for authentication and

computer.org/ITPro 33 THE FUTURE OF WEB APPS

access control. Neither GWT nor Sausalito have Time-to-Market such support. GWT’s easier learning curve facilitates the rapid prototyping and development of Web applica- Compatibility tions. XFormsDB and Sausalito allow rapid pro- All three frameworks can consume data from totyping but require additional learning up front. third-party systems, such as through Represen- tational State Transfer (REST) APIs. In addi- Support tion, Sausalito has a built-in solution for building Both XFormsDB and GWT provide visual de- RESTful services, whereas XFormsDB can velopment tools, whereas Sausalito provides only expose its application data through eXist-db’s development tools for . The development RESTful API. With GWT, support for RESTful community around GWT is very active and its services must be implemented manually with documentation is extensive, whereas the docu- the help of external libraries. mentation for XFormsDB and Sausalito is less advanced. Operability For an author with little technical knowledge, Framework Comparisons Sausalito and especially XFormsDB are easy to According to our evaluation, logic-centric im- learn,11 because they’re both based on declara- perative GWT is the most mature and powerful tive languages with limited functionality. The of the three frameworks. It also provides the best adoption rate of both XForms and XQuery, support in terms of documentation, activity, and however, is still quite low, despite their being tools. Data-centric declarative Sausalito deli- W3C recommendations. In contrast, an author vers the most scalable solution with good built- with excellent technical knowledge, especially in machine-to-machine communication support. in Java, might find GWT’s learning curve very Presentation-centric declarative XFormsDB of- gentle. fers the most attractive solution for authors with little technical knowledge. Performance efficiency However, there are other Web application Of the three frameworks, Sausalito is the only frameworks representing a tier-centric architec- one designed with scalability in mind; it provides tural expansion idea: a built-in solution for deploying Web applica- tions to a cloud infrastructure. With GWT, per- • XML-based QAFE (www.qafe.com); formance isn’t an issue, whereas response times • XQuery-based eXist-db;8 in XFormsDB are reasonable but not highly • JavaScript-based Helma (www.helma.org); and optimized. • HTML-based .12

Maintainability Figure 3 compares these frameworks according Both XFormsDB and Sausalito rely heavily on to whether they’re imperative or declarative (or W3C standards, which increase code modula- a hybrid of the two) and where they originate in rity and reusability. GWT, alternatively, provides the three-tier structure. For each framework, we an extensive component library. In addition, also indicate the year of origin (the year of its both XFormsDB and GWT are open-source first release or relevant publication). Note that projects, so they can be easily modified and the imperative-versus-declarative comparison is extended. fuzzy—that is, more imperative frameworks ap- pear on the left, more declarative frameworks Portability appear on the right, and the hybrid frameworks Development environments for XFormsDB, are closer to the middle. GWT, and Sausalito all come with executable We can roughly identify three clusters in scripts and a bundled Web server, so they’re easy Figure 3. The XML- and XQuery-based frame- to install and uninstall. Sausalito also provides a works originating from presentation and data tiers built-in solution for deploying production-ready are typically declarative. In turn, logic-centric Web applications to a cloud infrastructure. GWT and presentation-centric Helma are imperative.

34 IT Pro September/October 2011 Imperative Declarative

Angular, in the inter mediate posi- Helma Angular XFormsDB QAFE tion, is a hybrid framework. (2005) (2009) (2007) (2008) Although a proper discussion of Web application development ap- Presentation proaches is out of this article’s scope (a related discussion appe- GWT ars elsewhere13), we should men- (2006) tion that model-driven development approaches also exist, such as Logic RUX+WebML,14 UWE4JSF,15 and OOH4RIA.16 In such approaches, the Sausalito eXist-db development process involves creat- (2008) (2007) ing a set of models for an application and then using a declarative graphi- Data cal language to transform them into a code implementation. Figure 3. A comparison of the frameworks according to where they verall, GWT seems more appear on an imperative-declarative language scale and where they functional and mature and originate in a three-tier application structure. The XML- and XQuery- O provided better support. Yet based frameworks are typically declarative, logic-centric GWT and declarative XFormsDB and Sausalito presentation-centric Helma are imperative, while Angular is a hybrid are sufficiently mature to let experts framework. from a corresponding tier author highly interactive Web applications. All of the evaluated 6. M. Laine, “XFormsDB—An XForms-Based Frame- approaches offer compelling alternatives to conven- work for Simplifying Web Application Development,” tional three-tier Web development. With the ongo- master’s thesis, Dept. Media Technology, Aalto Univ. ing trend in deploying Web applications on cloud School of Science, 2010. platforms—where developers have little or no con- 7. M. Honkala, O. Koskimies, and M. Laine, “Con- trol over the resources the applications are using— necting XForms to Databases,” W3C Workshop on the declarative style of Web application develop- Declarative Models of Distributed Web Applica- ment becomes particularly promising. We thus tions, 2007; www.w3.org/2007/02/dmdwa-ws/Papers/ argue that declarative Web application frameworks oskari-koskimies.pdf. will play much larger role in the coming years. 8. W. Meier, “eXist: An Open Source Native XML Database,” Web, Web-Services, and Database Systems, References LNCS 2593, Springer, 2003, pp. 169–183. 1. G. Alonso et al., Web Services: Concepts, Architectures 9. ISO/IEC 25010:2011: Systems and Software Engineering— and Applications (Data-Centric Systems and Applications), Systems and Software Quality Requirements and Evalu- Springer, 2003. ation (SQuaRE)—System and Software Quality Models, 2. T. Mikkonen and A. Taivalsaari, Web Applications— Int’l Standards Organization/Int’l Electrotechnical Spaghetti Code for the 21st Century, tech. report TR- Commission, 2011. 2007-166, Sun Microsystems, June 2007. 10. J. Offutt, “Quality Attributes of Web Software Applica- 3. D. Appleby and J. VandeKopple, Programming Lang- tions,” IEEE Software, vol. 19, no. 2, 2002, pp. 25–32. uages: Paradigm and Practice, Computer Science Series, 11. M. Åkerberg, “Evaluation of XFormsDB-Based Ap- McGraw-Hill, 1997. plication Development—A Case Study,” master’s 4. M. Honkala, “Web User Interaction—A Declarative thesis, Dept. Media Technology, Aalto Univ. School Approach Based on XForms,” doctoral dissertation, of Science, 2010. Dept. Computer Science and Eng., Helsinki Univ. of 12. M. Hevery and A. Abrons, “Declarative Web- Technolog y, 2006. Applications without Server: Demonstration of How 5. J. Kuuskeri and T. Mikkonen, “Partitioning Web Ap- a Fully Functional Web-Application can be Built in plications between the Server and the Client,” J. Web an Hour with only HTML, CSS & Java- Eng., vol. 9, no. 3, 2010, pp. 207–226. Script Library,” Proc. Object-Oriented Programming,

computer.org/ITPro 35 THE FUTURE OF WEB APPS

Systems, Languages & Applications (OOPSLA 09), ACM from the Aalto University. Contact him at markku.laine@ Press, 2009, pp. 801–802. aalto.fi. 13. G. Toffetti et al., “State-of-the-Art and Trends in the Systematic Development of Rich Internet Applica- Denis Shestakov is a postdoctoral researcher in the Depart- tions,” J. Web Eng., vol. 10, no. 1, 2011, pp. 70–86. ment of Media Technology at the Aalto University, Finland. 14. M. Linaje, J.C. Preciado, and F. Sanchez-Figueroa, His research interests span Web data management and massive “Engineering Rich Internet Application User Inter- data processing, with a focus on scalable Web agents. Shesta- faces over Legacy Web Models,” IEEE Internet Comput- kov received his PhD in computer science from the University ing, vol. 11, no. 6, 2007, pp. 53–59. of Turku, Finland. Contact him at [email protected]. 15. C. Kroiss, N. Koch, and A. Knapp, “UWE4JSF: A Model-Driven Generation Approach for Web Ap- Evgenia Litvinova is a research assistant in the De- plications,” Proc. 9th Int’l Conf. Web Eng. (ICWE 09), partment of Media Technology at the Aalto University, LNCS 5648, Springer, 2009, pp. 493–496. Finland. Her research interests include end-user Web 16. S. Meliá et al., “A Model-Driven Development deve lopment and Web usability. Litvinova received her for GWT-Based Rich Internet Applications with MSc in computer science from the University of Eastern OOH4RIA,” Proc. 8th Int’l Conf. Web Eng. (ICWE 08), Finland. Contact her at [email protected]. IEEE Press, 2008, pp. 13–23. Petri Vuorimaa is a full professor in the Department of Markku Laine is a doctoral student in the Department Media Technology at the Aalto University, Finland. His of Media Technology at the Aalto University, Finland. research interests include Web-based services, smart spaces, His research interests include declarative Web applica- and mobile media applications. Vuorimaa received his DSc tion development and Web performance optimization. in computer science from the Tampere University of Tech- Laine received his MSc in communications engineering nology, Finland. Contact him at [email protected].

EXECUTIVE STAFF Executive Director: Angela R. Burgess; Associate Executive Director, Director, Governance: Anne Marie Kelly; Director, Finance & PURPOSE: The IEEE Computer Society is the world’s largest Accounting: John Miller; Director, Information Technology & Services: association of computing professionals and is the leading provider Ray Kahn; Director, Membership Development: Violet S. Doan; Director, of technical information in the field. Products & Services: Evan Butterfield MEMBERSHIP: Members receive the monthly magazine Computer, discounts, and opportunities to serve (all activities are led by COMPUTER SOCIETY OFFICES volunteer members). Membership is open to all IEEE members, Washington, D.C.: 2001 L St., Ste. 700, Washington, D.C. 20036-4928 affiliate society members, and others interested in the computer field. Phone: tFax: +1 202 728 9614 COMPUTER SOCIETY WEBSITE: www.computer.org Email: [email protected] Los Alamitos: 10662 Los Vaqueros Circle, Los Alamitos, CA 90720-1314 Next Board Meeting: 13–14 Nov., New Brunswick, NJ, USA Phone: tEmail: [email protected] EXECUTIVE COMMITTEE MEMBERSHIP & PUBLICATION ORDERS President: Sorel Reisman* Phone: tFax: tEmail: [email protected] President-Elect: John W. Walz;* Past President: James D. Isaak;* VP, Asia/Pacific: Watanabe Building, 1-4-2 Minami-Aoyama, Minato-ku, Tokyo Standards Activities: Roger U. Fujii;† Secretary: Jon Rokne (2nd VP);* VP, 107-0062, Japan Educational Activities: Elizabeth L. Burd;* VP, Member & Geographic Phone: tFax: +81 3 3408 3553 Activities: Rangachar Kasturi;† VP, Publications: David Alan Grier (1st VP);* Email: [email protected] VP, Professional Activities: Paul K. Joannou;* VP, Technical & Conference IEEE OFFICERS Activities: Paul R. Croll;† Treasurer: James W. Moore, CSDP;* 2011–2012 IEEE President: Moshe Kam; President-Elect: Gordon W. Day; Past President: Division VIII Director: Susan K. (Kathy) Land, CSDP;† 2010–2011 IEEE Division Pedro A. Ray; Secretary: Roger D. Pollard; Treasurer: Harold L. Flescher; V Director: Michael R. Williams;† 2011 IEEE Division Director V Director- President, Standards Association Board of Governors: Steven M. Mills; VP, Elect: James W. Moore, CSDP* *voting member of the Board of Governors †nonvoting member of the Board of Governors Educational Activities: Tariq S. Durrani; VP, Membership & Geographic Activities: Howard E. Michel; VP, Publication Services & Products: David BOARD OF GOVERNORS A. Hodges; VP, Technical Activities: Donna L. Hudson; IEEE Division V Term Expiring 2011: Elisa Bertino, Jose Castillo-Velázquez, George V. Director: Michael R. Williams; IEEE Division VIII Director: Susan K. (Kathy) Cybenko, Ann DeMarle, David S. Ebert, Hironori Kasahara, Steven L. Tanimoto Land, CSDP; President, IEEE-USA: Ronald G. Jensen Term Expiring 2012: Elizabeth L. Burd, Thomas M. Conte, Frank E. Ferrante, Jean-Luc Gaudiot, Paul K. Joannou, Luis Kun, James W. Moore Term Expiring 2013: Pierre Bourque, Dennis J. Frailey, Atsuhiro Goto, André Ivanov, Dejan S. Milojicic, Jane Chu Prey, Charlene (Chuck) Walrad revised 24 August 2011

36 IT Pro September/October 2011