1、 外文翻译 原文 Understanding Mashup Development Material Source:puter.org/portal/web/csdl/doi/10.1109/MIC.2008.114 Author: Jin Yu, Boualem Benatallah,F abio Casati,F lorian Daniel Web mashups are Web applications developed using contents and servicesavailable online.Despite rapidly increasing interest in
2、mashups over the pasttwo years, comprehensive development tools and frameworks are lacking,and in most cases mashing up a new application implies a significant manualprogramming effort. This article overviews current tools,frameworks,andtrends that aim to facilitate mashup development. The authors u
3、se a set ofcharacteristic dimensions to highlight the strengths and weaknesses of somerepresentative approaches.Web mashups1 are Web applicationsgenerated by combiningcontent, presentation, or applicationfunctionality from disparateWeb sources.They aim to combinethese sources to create useful new ap
4、plicationsor services. Content and presentationelements typically come inthe form of RSS or Atom feeds, various XML formats, or as HTML, Shock-Wave Flash(SWF),or other graphicalelements. Publicly available APIs(inJavaScript, for example) typically provideapplication functionality. Content,functional
5、ity, and presentation are thenglued together in disparate ways: viaJavaScript in the browser, server-sidescripting languages such as HypertextPreprocessor(PHP) or Ruby, or traditionallanguages such as Java or C#.”Mashup” has become one of thehottest buzzwords in the Web applicationsarea, and many co
6、mpanies andinstitutions are rushing to providemashup solutions(or to relabel existingintegration solutions as mashuptools).Amidst this frenzy,its difficultto distinguish between mashups andtraditional integration efforts. Thisarticle aims to provide some clarity inregard towhat a mashup is(and isnt)
7、;how mashups resemble or differfrom traditional forms of integration,such as application, data, andpresentation integration;what fundamental characteristicsand dimensions Mashup approachesshare;and how current tools compare with respect tothese characteristics and dimensions.Specifically,we overview
8、 some of the popularmashup tools and show how they facilitate thedevelopment of rich Internet applications. Our aim isnt to identify the kinds of available support in terms of mashup development but rather to understand and identify emerging characteristics and dimensions under which we can comparea
9、nd analyze the tools and approaches. Mashup Development Approaches Mashup development differs from traditional component-based application development mainly in that mashups typically serve a specific situational (short-lived) need and are composed of the latest, easy-to-use Web technologies (such a
10、s Representational State Transfer RESTful Web services or RSS/Atom feeds). As such,the Web is their natural environment.The HousingMaps ()application in Figure 1 is an example of a successful mashup. It combines property listings from Craigslist with map data from Google Maps to assist people moving
11、 from one city to another and searching for housing. Typically,when people are browsing through a list of properties, a propertys address doesnt give them enough information if they arent yet familiar with the new city. HousingMaps gives users a list of properties and plots the respective locations
12、and property information on the map upon selection (using the popup cloud visible in Figure 1).We could manually develop such a mashup application using conventional Web programming technologies. However, dedicated Mashup tools could benefit such development, eventually letting even end users compos
13、e their own mashups. Manual Mashup Development Generally, integrating enterprise data and applications into a coherent and value-adding application requires programming skills and intimate knowledge about the schemes and semantics of data sources or the business protocol conventions for message exch
14、ange. Fortunately,new technologies, such as Ajax and RESTful services, and microformats, such as RSS and Atom, have simplified mashup development. In addition, intelligent source components largely assist the integration of contents, application logic, and user interfaces. Nevertheless, manual mashu
15、p development is still a prerogative of skilled developers.Assuming you have no specific development tools, whats involved in manually developing an application like HousingMaps? First,you must become familiar with the two source applications (Craigslist and Google Maps) and identify how you will re
16、use or extract data from the two sites. Whereas Google Maps offers a publicly available JavaScript API that you can leverage, Craigslist provides its listings via RSS.Therefore, to extract property and address data,you must parse and interpret the RSS feed from Craigslist. To configure the clickable
17、 markers that will display the property information in a popup cloud window upon a click, you must interact with the Google Maps JavaScript API. Enabling the automatic popup of this cloud requires a specific JavaScript function that listens for the property selection and reacts by invoking the Googl
18、e Maps API to select the respective marker.Although Google Maps has its own user interface,letting users select properties wrapped from Craigslist requires that you fill and appropriately format a suitable table. Finally, you must lay out the two components properly to form the composite application
19、s user interface. Such intricate and time-consuming tasks prevent average users from programming their own mashups. Tool-Assisted Mashup Development To speed the overall mashup development process,but also to enable even inexperienced end users to mash up their own Web applications,numerous mashup-s
20、pecific development tools and frameworks have recently emerged. Theseinstruments typically come with a variety of features and a mixture of composition approaches.A close look at them lets us identify the open issues and research challenges characterizing the mashup phenomenon.For presentation purpo
21、ses, we selected the most popular or representative approaches of end-user mashup tools and show how they can support the HousingMaps applications development.We discuss a few alternative or complimentary approaches in the “Related Work in Reusable Components” sidebar. Yahoo Pipes. Yahoo Pipes (http
22、:/) lets you mix popular data feeds to create data mashups via a visual editor. A pipe is a dataprocessing pipeline consisting of one or more data sources (for example, RSS/Atom feeds or XML sources) and a set of interconnecting operators,each of which performs a specific task. It includes operators
23、 for manipulating data feeds (for example,sorting or filtering) and operators for features such as looping, regular expressions, or counting.It also supports more advanced features, such as location extraction (for example, geocoordinates identified and converted from location information found in t
24、ext fragments) or term extraction(for example, keywords). Yahoo Pipes aims to let users design data-processing pipelines that filter,transform, enrich, and combine data feeds and are again exposed as RSS feeds.Consider how Yahoo Pipes could aid the development of the HousingMaps example.Because Pipe
25、s doesnt provide user interfaces-that is, it outputs an RSS feed-we cantimplement the user interface shown in Figure1. Instead, we could use Pipes to process the Craigslist feed and identify location information (geocodes) by leveraging the pipes location extractor. We could use the identified locat
26、ion information to augment the Craigslist feed with a link that lets users display the propertys address on the map by passing the geocodes to Google Maps. Google Mashup Editor. GME (http:/) provides a template-based environment for mashup development. It offers a set of standard modules that lets u
27、sers encapsulate and lay out external data. For example,the list module represents an RSS/Atom feed as a list, whereas the item module represents a single item in a feed. Modules can fire predefined events, which other modules can capture and act on accordingly. Creating mashups involves developing
28、user interface templates that contain a mixture of XML control tags and HTML/CSS layout elements with embedded JavaScript code. At runtime, GME fills the user interface templates and presents them as Web pages.For the HousingMaps application, we could integrate the Craigslist feed using a list modul
29、e and use the item module to show a particular propertys details. GMEs map module natively supports Google Maps. When the user clicks on a property in the Craigslist module, the module emits a “select” event, which the map module can capture to pop up the cloud window on top of the marker and displa
30、y information about the selected property. We must embed the Craigslist module and Google Maps into the user interface template that specifies the actual mashup applications layout. Microsoft Popfly. Popfly (www.popfly.ms) offers a component-based, visual environment for developing mashups. In Popfl
31、y, reusable components,or blocks, can act as middlemen between externally provisioned services, such as Web services,2 or implement a useful function (in JavaScript)-for example, a function that calculates a circles area given a radius. Blocks have operations with inputs and outputs, which are speci
32、fied in a dedicated XML descriptor. A block might also act as a display surface-that is, a piece of user interface that takes data from other blocks and displays them, letting the user interact with them and enabling the Mashup developer to lay out the mashup application.To build the HousingMaps app
33、lication, we need three blocks:an RSS feed block for the Craigslist feed,a map block, and a table block.If we use Virtual Earth (http:/ instead of Google Maps, the three blocks are already available. We must therefore drag the blocks onto the mashup design surface and then connect the output of the
34、RSS blocks getItems operation to the two display blocks for the RSS and Virtual Earth. Correctly configuring the initial set of markers might require extending the RSS block with a suitable JavaScript operation. Intel Mash Maker. Mash Maker (http:/) provides an environment for integrating data from
35、annotated source Web pages based on a powerful, dedicated browser plug-in. Rather than taking input from structured data sources such as RSS or Atom, Mash Maker lets users annotate Web pages structure while browsing and use such annotations to scrap contents from annotated pages. Advanced users can
36、leverage the integrated structure editor to input XPath expressions using FireBugs DOM Inspector (a plug-in for the Firefox Web browser). Composing mashups with Mash Maker occurs via a copy-and-paste paradigm, based on two modes of merging contents:whole page merging, in which the user inserts one p
37、ages content as a header into another page; and item-wise merging, in which the user combines contents from two pages at row level,based on additional user annotations.You can use the two techniques to merge more than two pages.For the HousingMaps example, we first annotate the appropriate Craigslis
38、t pages structure because Mash Maker operates on regular HTML content rather than on RSS. Next, we merge the Craigslist page with the Google Maps page using the copy-and-paste mechanism. Specifically, we adopt item-wise merging because we plot each item from the Craigslist page as an individual mark
39、er on the map. Quick and Easily Done Wiki. QedWiki (http:/ is IBMs proposal for a wiki-based “mashup maker,”fully running inside the client browser and allowing access to IBMs Mashup Hub (http:/ The Hub supports the creation of data feeds and user interface widgets and incorporates Data Mashup Fabri
40、c for Intranet Applications(Damia)3 for data assembly and manipulation. As a wiki environment, it lets users edit, immediately view, and easily share mashups. Mashups are assembled from JavaScript- or PHP-based widgets, whose wiring determines the mashups behavior. Widgets represent application comp
41、onents and might or might not have their own user interface. To assemble a mashup, a user selects a page layout (an HTML template) and then drags and drops widgets onto the page grid and interactively configures them. To develop the HousingMaps application with QedWiki, we first create a new wiki pa
42、ge and select a grid layout. In our case, we opt for a layout that lets us place Google Maps and the housing offers side by side (in two columns).We then search for the GoogleMap widget in the widget palette, drag it over the grid layout,and drop it over the left column. We use the LoadFeed widget t
43、o access the Craigslist RSS feed and populate a ShowData widget with the housing offers (by telling the ShowData widget that it should source data from the LoadFeed widget). To locate properties on the map, we can now simply drag addresses from the Show-Data widget at runtime and drop them onto the
44、GoogleMap widget. Characterizing Mashup Approaches As youll have noticed, the tools weve described differ in two complementary aspects:the mashup paradigm at the basis of the approach and the software instrument that implements the chosen paradigm.Much like in data and application integration,we cha
45、racterize the mashup paradigm by looking at the objects of integration (the components)and how such objects are glued together (the composition logic). As for the software instrument,its important to separately look at the design-time support (the development environment)and the runtime support (the
46、 runtime environment) provided. Development Environment The characteristics of the mashup tools development environments affect mashup development efficiency and determine the tools success.Mashup tools vary greatly in the level of support they provide to their users. Some tools are strictly for dev
47、elopers, whereas others are more oriented toward end users. Several properties characterize mashup development environments.The first property is the environments interface paradigm and target users. Mashup tools can support design via different interface/modeling paradigms, such as visual drag-andd
48、rop features, textual editors, or a combination of the two. The interface can target average Web users, advanced (tech-savvy) users, or programmers.The interfaces ease of use is the key factor in bringing mashup capability to average and advanced Internet users.A development environment is also char
49、acterized by system requirements. The Mashup tools execution might require specific additional modules, plug-ins, or browser features, whose absence might prevent the instruments use.Yahoo Pipes provides a pure visual dragand-drop Ajax editor targeted at users with basic programming skills. The editor is executed in a standard Web browser with support for the XML
