Software Architecture Group University of Waterloo CANADA Architecture Recovery Of Web Applications

Traditional Software Visualization LINUX

Visualization of Web Applications

Example of a Web Application Island Hopper News A sample web app. from MS

Web Application as a 3-tiered system

Web Applications “Online in days, Innovate at Web Speed, Change on a Dime”..Asera Inc. “Zero to Web Speed”..Oracle

SE Challenges for Web Apps? The speed of development The speed of evolution The different sets of concerns The expectations of the user The origins of the web

Introduction to ASP Simple html file: (foo.html) Welcome to CNN.COM ASP file: (foo.asp) Welcome to

Introduction to ASP Interesting asp file: (foo2.asp) Welcome to

Introduction to ASP ASP files are preprocessed by the web server ASP files access web server built in objects or distributed objects (COM/DCOM/COM+/CORBA) ASP files can access databases too

Introduction to ASP file.aspfile.html Data Tables COM/ CORBA Objects Web Server Pre-processor Data Flow

DEMO Visualization of the sample web application

How to visualize web applications?

Structure of an ASP Page ASP Page Client ScriptsServer ScriptsHTML JScriptPerlVBScript JavaScript

Generating the info to visualize HTML Extractor DB Access Extractor ASP PageCOM Source Code COM Binary ASP Code ASP Extractor HTML Facts ASP Facts Data Facts Language Extractor Binary Extractor Source Code Facts Binary Facts

First Attempt - Visualization

FACTBASE Generating Views for Web App. HTML Facts ASP Facts Data Facts Source Code Facts Binary Facts Contain. Grok Layout Viewer

Visualization

Conclusion Web Apps developers face different challenges than Traditional Soft Visualization of Web Apps using our current tools is possible Large Web Apps have been visualized

Revealing some of the magic --- The hidden track!

FACTBASE Generating Views for Web App. HTML Facts ASP Facts Data Facts Source Code Facts Binary Facts Contain. Grok Layout Viewer

The Web App Domain Model Java, JavaScript, VBScript, C, C++, etc. Component & Subsystem ASP, Database, DLL, COM Object, etc.

Entity Level Schema for JavaScript ALS CLS ELS

Entity Level Schema for VBScript ALS CLS ELS

Common Entity Level Schema for Object Based Languages ALS CLS ELS

Component Level Schema for Web Applications ALS CLS ELS

Architecture Level Schema ALS CLS ELS

Conclusion A Web App is the legacy application of the future A tool is built to visualize Web Apps and gain a better understanding of them A scalable framework is presented to study Web Apps Dynamic & Static views are needed to understand Web Apps

“Every day it becomes clear that the Net (Web) is taking its place alongside the other great transformational technologies that first challenged, and then fundamentally changed, the way things are done in the world”, Lou Gestner, CEO of IBM Corp.

A Taxonomy for Web Applications

Web App. Vs. Traditional App. Technical properties of Web App.: –Concerned with data tables, distributed objects and multimedia objects instead of variables, procedures and simple objects –Heavy use of scripting to combine components together –Implemented using multiple languages

Web App. Vs. Traditional App. Non Technical properties of Web App: –Shorter development time expected –Lower costs expected too! –Average employment length just over 1 year!!