A mashup (computer industry
jargon
Jargon is the specialized terminology associated with a particular field or area of activity. Jargon is normally employed in a particular Context (language use), communicative context and may not be well understood outside that context. The conte ...
), in
web development
Web development is the work involved in developing a website for the Internet (World Wide Web) or an intranet (a private network). Web development can range from developing a simple single static page of plain text to complex web applications ...
, is a
web page or
web application
A web application (or web app) is application software that is accessed using a web browser. Web applications are delivered on the World Wide Web to users with an active network connection.
History
In earlier computing models like client-serve ...
that uses content from more than one source to create a single new service displayed in a single graphical interface. For example, a user could combine the addresses and photographs of their library branches with a Google map to create a map mashup. The term implies easy, fast integration, frequently using open application programming interfaces (
open API) and data sources to produce enriched results that were not necessarily the original reason for producing the raw source data.
The term mashup originally comes from creating something by combining elements from two or more sources.
The main characteristics of a mashup are combination, visualization, and aggregation. It is important to make existing data more useful, for personal and professional use. To be able to permanently access the data of other services, mashups are generally
client applications or hosted online.
In the past years, more and more Web applications have published APIs that enable software developers to easily integrate data and functions the
SOA way, instead of building them by themselves. Mashups can be considered to have an active role in the evolution of
social software and
Web 2.0. Mashup composition tools are usually simple enough to be used by end-users. They generally do not require programming skills and rather support visual wiring of
GUI widget
A graphical widget (also graphical control element or control) in a graphical user interface is an element of interaction, such as a button or a scroll bar. Controls are software components that a computer user interacts with through direct ...
s, services and components together. Therefore, these tools contribute to a new vision of the
Web
Web most often refers to:
* Spider web, a silken structure created by the animal
* World Wide Web or the Web, an Internet-based hypertext system
Web, WEB, or the Web may also refer to:
Computing
* WEB, a literate programming system created by ...
, where users are able to contribute.
The term "mashup" is not formally defined by any standard-setting body.
History
The broader context of the history of the Web provides a background for the development of mashups. Under the
Web 1.0
Web 2.0 (also known as participative (or participatory) web and social web) refers to websites that emphasize user-generated content, ease of use, participatory culture and interoperability (i.e., compatibility with other products, systems, and ...
model, organizations stored consumer data on
portals and updated them regularly. They controlled all the consumer data, and the consumer had to use their products and services to get the information.
The advent of
Web 2.0 introduced Web standards that were commonly and widely adopted across traditional competitors and which unlocked the consumer data. At the same time, mashups emerged, allowing mixing and matching competitors' APIs to develop new services.
The first mashups used mapping services or photo services to combine these services with data of any kind and therefore to produce visualizations of data.
[
]
In the beginning, most mashups were consumer-based, but recently the mashup is to be seen as an interesting concept useful also to enterprises. Business mashups can combine existing internal data with external services to generate new views on the data.
There was also the free
Yahoo! Pipes
Yahoo! Pipes was a web application from Yahoo! that provided a graphical user interface for building data mashups that aggregate web feeds, web pages, and other services; creating Web-based apps from various sources; and publishing those apps. ...
to build mashups for free using the
Yahoo! Query Language
Yahoo! Query Language (YQL) is an SQL-like query language created by Yahoo! as part of their Developer Network. YQL is designed to retrieve and manipulate data from APIs through a single Web interface, thus allowing mashups that enable develope ...
.
Types of mashup
There are many types of mashup, such as business mashups, consumer mashups, and data mashups. The most common type of mashup is the consumer mashup, aimed at the general public.
* ''Business'' (or ''enterprise'') ''mashups'' define applications that combine their own resources, application and data, with other external
Web services.
They focus data into a single presentation and allow for collaborative action among businesses and developers. This works well for an
agile development
In software development, agile (sometimes written Agile) practices include requirements discovery and solutions improvement through the collaborative effort of self-organizing and cross-functional teams with their customer(s)/ end user(s), ad ...
project, which requires collaboration between the developers and customer (or customer proxy, typically a product manager) for defining and implementing the business requirements. Enterprise mashups are secure, visually rich Web applications that expose actionable information from diverse internal and external information sources.
* ''Consumer mashups'' combine data from multiple public sources in the browser and organize it through a simple browser user interface. ''(e.g.:
Wikipediavision
Wikipediavision is a site that shows in semi-realtime where anonymous edits to Wikipedia are originating from. It was launched in the fall of 2007 by László Kozma, at that time a student in Finland. The site combines Wikipedia's recent change ...
combines Google Map and a Wikipedia API)''
* ''Data mashups'', opposite to the consumer mashups, combine similar types of media and information from multiple sources into a single representation. The combination of all these resources create a new and distinct
Web service that was not originally provided by either source.
By API type
Mashups can also be categorized by the basic API type they use but any of these can be combined with each other or embedded into other applications.
Data types
*
Indexed data (documents, weblogs, images, videos, shopping articles, jobs ...) used by
metasearch engines
A metasearch engine (or search aggregator) is an online information retrieval tool that uses the data of a web search engine to produce its own results. Metasearch engines take input from a user and immediately query search engines for results. S ...
* Cartographic and geographic data:
geolocation software
In computing, Internet geolocation is software capable of deducing the geographic position of a device connected to the Internet. For example, the device's IP address can be used to determine the country, city, or ZIP code, determining its geograp ...
,
geovisualization
* Feeds, podcasts:
news aggregator
In computing, a news aggregator, also termed a feed aggregator, feed reader, news reader, RSS reader or simply an aggregator, is client software or a web application that aggregates syndicated web content such as online newspapers, blogs, podc ...
s
Functions
* Data converters:
language translators,
speech processing,
URL shorteners
URL shortening is a technique on the World Wide Web in which a Uniform Resource Locator (URL) may be made substantially shorter and still direct to the required page. This is achieved by using a redirect which links to the web page that has a ...
...
* Communication:
email
Electronic mail (email or e-mail) is a method of exchanging messages ("mail") between people using electronic devices. Email was thus conceived as the electronic ( digital) version of, or counterpart to, mail, at a time when "mail" meant ...
,
instant messaging
Instant messaging (IM) technology is a type of online chat allowing real-time text transmission over the Internet or another computer network. Messages are typically transmitted between two or more parties, when each user inputs text and trigge ...
,
notification...
* Visual data rendering:
information visualization, diagrams
* Security related:
electronic payment systems,
ID identification...
*
Editors
Mashup enabler
In technology, a mashup enabler is a tool for transforming incompatible IT resources into a form that allows them to be easily combined, in order to create a mashup. Mashup enablers allow powerful techniques and tools (such as mashup platforms) for combining data and services to be applied to new kinds of resources. An example of a mashup enabler is a tool for creating an
RSS
RSS ( RDF Site Summary or Really Simple Syndication) is a web feed that allows users and applications to access updates to websites in a standardized, computer-readable format. Subscribing to RSS feeds can allow a user to keep track of many di ...
feed from a spreadsheet (which cannot easily be used to create a mashup). Many mashup editors include mashup enablers, for example, Presto Mashup Connectors, Convertigo Web Integrator or
Caspio Bridge.
Mashup enablers have also been described as "the service and tool providers,
icthat make mashups possible".
History
Early mashups were developed manually by enthusiastic programmers. However, as mashups became more popular, companies began creating platforms for building mashups, which allow designers to visually construct mashups by connecting together mashup components.
Mashup editors have greatly simplified the creation of mashups, significantly increasing the productivity of mashup developers and even opening mashup development to end-users and non-IT experts. Standard components and connectors enable designers to combine mashup resources in all sorts of complex ways with ease. Mashup platforms, however, have done little to broaden the scope of resources accessible by mashups and have not freed mashups from their reliance on well-structured data and open libraries (
RSS
RSS ( RDF Site Summary or Really Simple Syndication) is a web feed that allows users and applications to access updates to websites in a standardized, computer-readable format. Subscribing to RSS feeds can allow a user to keep track of many di ...
feeds and public
API
An application programming interface (API) is a way for two or more computer programs to communicate with each other. It is a type of software Interface (computing), interface, offering a service to other pieces of software. A document or standa ...
s).
Mashup enablers evolved to address this problem, providing the ability to convert other kinds of data and services into mashable resources.
Web resources
Of course, not all valuable data is located within organizations. In fact, the most valuable information for business intelligence and decision support is often external to the organization. With the emergence of
rich web applications and online Web portals, a wide range of business-critical processes (such as ordering) are becoming available online. Unfortunately, very few of these data sources syndicate content in RSS format and very few of these services provide publicly accessible APIs. Mashup editors therefore solve this problem by providing enablers or connectors.
Mashups versus portals
Mashups and
portals are both
content aggregation technologies. Portals are an older technology designed as an extension to traditional
dynamic Web applications, in which the process of converting data content into marked-up Web pages is split into two phases: generation of markup "fragments" and aggregation of the fragments into pages. Each markup fragment is generated by a "
portlet
The Java Portlet Specification defines a contract between the portlet container and portlets and provides a convenient programming model for Java portlet developers.
Portlets are pluggable user interface software components that are managed and ...
", and the portal combines them into a single Web page. Portlets may be hosted locally on the portal server or remotely on a separate server.
Portal technology defines a complete event model covering reads and updates. A request for an aggregate page on a portal is translated into individual read operations on all the portlets that form the page ("
render
" operations on local,
JSR 168 portlets or "
getMarkup
" operations on remote,
WSRP
WSRP (910 AM) is a radio station broadcasting a Regional Mexican format. Licensed to Jacksonville, North Carolina
Jacksonville is a city in Onslow County, North Carolina, United States. As of the 2020 census, the population was 72,723, w ...
portlets). If a submit button is pressed on any portlet on a portal page, it is translated into an update operation on that portlet alone (
processAction
on a local portlet or
performBlockingInteraction
on a remote, WSRP portlet). The update is then immediately followed by a read on ''all'' portlets on the page.
Portal technology is about server-side,
presentation-tier aggregation. It cannot be used to drive more robust forms of application integration such as
two-phase commit.
Mashups differ from portals in the following respects:
The portal model has been around longer and has had greater investment and product research. Portal technology is therefore more standardized and mature. Over time, increasing maturity and standardization of mashup technology will likely make it more popular than portal technology because it is more closely associated with Web 2.0 and lately
Service-oriented Architectures (SOA). New versions of portal products are expected to eventually add mashup support while still supporting legacy portlet applications. Mashup technologies, in contrast, are not expected to provide support for portal standards.
Business mashups
Mashup uses are expanding in the business environment. Business mashups are useful for integrating business and data services, as business mashups technologies provide the ability to develop new integrated services quickly, to combine internal services with external or personalized information, and to make these services tangible to the business user through user-friendly Web browser interfaces.
Business mashups differ from consumer mashups in the level of integration with business computing environments, security and access control features, governance, and the sophistication of the programming tools (mashup editors) used. Another difference between business mashups and consumer mashups is a growing trend of using business mashups in commercial
software as a service
Software as a service (SaaS ) is a software licensing and delivery model in which software is licensed on a subscription basis and is centrally hosted. SaaS is also known as "on-demand software" and Web-based/Web-hosted software.
SaaS is con ...
(SaaS) offering.
Many of the providers of business mashups technologies have added
SOA features.
Architectural aspects of mashups
The architecture of a mashup is divided into three layers:
* Presentation /
user interaction
Ancient Egyptian roles
* User (ancient Egyptian official), an ancient Egyptian nomarch (governor) of the Eighth Dynasty
* Useramen, an ancient Egyptian vizier also called "User"
Other uses
* User (computing), a person (or software) using an ...
: this is the
user interface
In the industrial design field of human–computer interaction, a user interface (UI) is the space where interactions between humans and machines occur. The goal of this interaction is to allow effective operation and control of the machine f ...
of mashups. The technologies used are
HTML
The HyperText Markup Language or HTML is the standard markup language for documents designed to be displayed in a web browser. It can be assisted by technologies such as Cascading Style Sheets (CSS) and scripting languages such as JavaScri ...
/
XHTML
Extensible HyperText Markup Language (XHTML) is part of the family of XML markup languages. It mirrors or extends versions of the widely used HyperText Markup Language (HTML), the language in which Web pages are formulated.
While HTML, prior ...
,
CSS
Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language such as HTML or XML (including XML dialects such as SVG, MathML or XHTML). CSS is a cornerstone techno ...
,
JavaScript
JavaScript (), often abbreviated as JS, is a programming language that is one of the core technologies of the World Wide Web, alongside HTML and CSS. As of 2022, 98% of Website, websites use JavaScript on the Client (computing), client side ...
,
Asynchronous JavaScript and Xml (Ajax).
* Web Services: the product's functionality can be accessed using API services. The technologies used are
XMLHTTPRequest
XMLHttpRequest (XHR) is an API in the form of an object whose methods transfer data between a web browser and a web server. The object is provided by the browser's JavaScript environment. Particularly, retrieval of data from XHR for the purpose o ...
,
XML-RPC
XML-RPC is a remote procedure call (RPC) protocol which uses XML to encode its calls and HTTP as a transport mechanism.Simon St. Laurent, Joe Johnston, Edd Dumbill. (June 2001) ''Programming Web Services with XML-RPC.'' O'Reilly. First Edition. ...
,
JSON-RPC,
SOAP
Soap is a salt of a fatty acid used in a variety of cleansing and lubricating products. In a domestic setting, soaps are surfactants usually used for washing, bathing, and other types of housekeeping. In industrial settings, soaps are use ...
,
REST.
* Data: handling the data like sending, storing and receiving. The technologies used are
XML
Extensible Markup Language (XML) is a markup language and file format for storing, transmitting, and reconstructing arbitrary data. It defines a set of rules for encoding documents in a format that is both human-readable and machine-readable. T ...
,
JSON
JSON (JavaScript Object Notation, pronounced ; also ) is an open standard file format and data interchange format that uses human-readable text to store and transmit data objects consisting of attribute–value pairs and arrays (or other ser ...
,
KML
Keyhole Markup Language (KML) is an XML notation for expressing geographic annotation and visualization within two-dimensional maps and three-dimensional Earth browsers. KML was developed for use with Google Earth, which was originally named Key ...
.
Architecturally, there are two styles of mashups: Web-based and server-based. Whereas Web-based mashups typically use the user's
web browser
A web browser is application software for accessing websites. When a user requests a web page from a particular website, the browser retrieves its files from a web server and then displays the page on the user's screen. Browsers are used on ...
to combine and reformat the data, server-based mashups analyze and reformat the data on a remote
server
Server may refer to:
Computing
*Server (computing), a computer program or a device that provides functionality for other programs or devices, called clients
Role
* Waiting staff, those who work at a restaurant or a bar attending customers and su ...
and transmit the data to the user's browser in its final form.
Mashups appear to be a variation of a
façade pattern The facade pattern (also spelled ''façade'') is a software-design pattern commonly used in object-oriented programming. Analogous to a facade in architecture, a facade is an object that serves as a front-facing interface masking more complex und ...
.
[Design Patterns: Elements of Reusable Object-Oriented Software () by Erich Gamma, Richard Helm, Ralph Johnson, and John Vlissides] That is: a software engineering design pattern that provides a simplified interface to a larger body of code (in this case the code to aggregate the different feeds with different
API
An application programming interface (API) is a way for two or more computer programs to communicate with each other. It is a type of software Interface (computing), interface, offering a service to other pieces of software. A document or standa ...
s).
Mashups can be used with software provided as a service (
SaaS
Software as a service (SaaS ) is a software licensing and delivery model in which software is licensed on a subscription basis and is centrally hosted. SaaS is also known as "on-demand software" and Web-based/Web-hosted software.
SaaS is cons ...
).
After several years of standards development, mainstream businesses are starting to adopt
service-oriented architecture
In software engineering, service-oriented architecture (SOA) is an architectural style that focuses on discrete services instead of a monolithic design. By consequence, it is also applied in the field of software design where services are provide ...
s (SOA) to integrate disparate data by making them available as discrete Web services. Web services provide open, standardized
protocol
Protocol may refer to:
Sociology and politics
* Protocol (politics), a formal agreement between nation states
* Protocol (diplomacy), the etiquette of diplomacy and affairs of state
* Etiquette, a code of personal behavior
Science and technology
...
s to provide a unified means of accessing information from a diverse set of platforms (
operating system
An operating system (OS) is system software that manages computer hardware, software resources, and provides common services for computer programs.
Time-sharing operating systems schedule tasks for efficient use of the system and may also in ...
s,
programming language
A programming language is a system of notation for writing computer programs. Most programming languages are text-based formal languages, but they may also be graphical. They are a kind of computer language.
The description of a programming ...
s,
applications). These Web services can be reused to provide completely new services and applications within and across organizations, providing business flexibility.
See also
*
Mashup (culture) Participants in an online music scene who rearrange spliced parts of musical pieces form mashup culture. The audio-files are normally in MP3 format and spliced with audio-editing software online. The new, edited song is called mashup. The expression ...
*
Mashup (music)
*
Open Mashup Alliance
The Open Mashup Alliance (OMA) is a non-profit consortium that promotes the adoption of mashup solutions in the enterprise through the evolution of enterprise mashup standards like EMML. The initial members of the OMA include some large technolog ...
*
Open API
*
Yahoo! Pipes
Yahoo! Pipes was a web application from Yahoo! that provided a graphical user interface for building data mashups that aggregate web feeds, web pages, and other services; creating Web-based apps from various sources; and publishing those apps. ...
*
Webhook
A webhook in web development is a method of augmenting or altering the behavior of a web page or web application with custom callbacks. These callbacks may be maintained, modified, and managed by third-party users and developers who may not neces ...
*
Web portal
*
Web scraping
References
Further reading
* Ahmet Soylu, Felix Mödritscher, Fridolin Wild, Patrick De Causmaecker, Piet Desmet. 2012
“Mashups by Orchestration and Widget-based Personal Environments: Key Challenges, Solution Strategies, and an Application.”Program: Electronic Library and Information Systems 46 (4): 383–428.
* Endres-Niggemeyer, Brigitte ed. 2013. Semantic Mashups. Intelligent Reuse of Web Resources. Springer. (Print)
{{DEFAULTSORT:Mashup (Web Application Hybrid)
Software architecture
Web 2.0
Web 2.0 neologisms
Web development