1. Introduction to Web Application Architectures Web Application Architectures 18 th March 2005 Bogdan L. Vrusias b.vrusias@surrey.ac.uk

2. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 20052 Contents Client-side Web application architectures Server-side Web application architectures n-tiered architectures.

3. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 20053 Client-side Architecture On a client-side architecture any possible processing for the Web application is performed on the client's browser. The Web server only keeps the necessary files and downloads them to the the users side, when requested. This style of architecture is called thick client or fat client architecture. The client-side architecture can either be static, where the user can not change anything on the page, or interactive, where the page can react with the user's actions. The user can also interact with other types of client-side applications such as Java Applets, ActiveX, and Flash. All types of files and applications that interact with the user on the client-side are downloaded from the browser when the HTML page is downloaded.

4. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 20054 Client-side Architecture Applications Popular applications of the client-side architecture are: –Static content: Basic information about a company or organisation, online catalogues, or personal Web pages. –Interactive marketing: The user can interact with the contents of the page; for example filtering and sorting tables. –E-learning: The user can access training courses, undertake interactive quizzes, or even learn how to cook. –Simple games: Games such as soccer, chess, cards, and other have been developed for the client-side.

5. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 20055 Client-side Technologies Currently the most popular client-side technologies are: –HTML –CSS –Java Applets –JavaScript –XML –XSL –VBScript –ActiveX Controls –Flash –…

6. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 20056 Client-side Technologies: VBScript Microsoft Visual Basic Scripting Edition (VBScript) is a scripting language like JavaScript. VBScript is used in the HTML document in the same way as JavaScript, but is not as well supported by the browsers as JavaScript. VBScript is used more on the server-side scripting to form Active Server Pages (ASP).

7. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 20057 Client-side Technologies: ActiveX Controls ActiveX controls are applet components developed by Microsoft (therefore are only supported by Internet Explorer on Microsoft Windows systems). ActiveX controls are downloaded and installed on the client's computer and executed inside the browser. ActiveX provide advanced graphics manipulation and multimedia experience that HTML and JavaScript can not provide. ActiveX controls are built using Microsoft C++ or Microsoft Visual Basic.

8. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 20058 Client-side Technologies: Flash Flash has been developed by Macromedia to provide impressive graphical display on a Web page. Flash requires the Macromedia Flash Player to be installed on the client's computer to be able to run. Flash is mainly used on front pages (welcome screens) of Web sites, or to provide demonstrations. Both Internet Explorer and Netscape support Flash.

9. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 20059 Java Applets Vs Other Java Applets provide advanced graphics manipulation and multimedia experience that HTML and JavaScript can not provide. Java Applets are built using Java, developed by Sun Microsystems. Java Applets are well supported by browsers and platforms, therefore are more popular than ActiveX controls. Java Applets require the Java Virtual Machine to be installed on the users computer to be able to run. The Applets themselves are not installed. ActiveX controls usually perform better that Java Applets.

10. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200510 Advantages of Client-side Architecture Building client-side applications is relatively easier that building server-side applications. Client-side processing offloads the Web server. You don't need extensive programming knowledge to build simple client-side Web applications. There are many easy to use visual tools that can build entire Web sites. The Web application can be tested instantly without the need of a Web server. It can be easily hosted by third-party Web hosting services, because there are no applications needed to be installed on the Web server.

11. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200511 Disadvantages of Client-side Architecture Event with the latest standardised versions (by W3C) of client-side technologies, browsers from browsers still have differences on processing the Web page. A considerable of Web users still use old versions of browsers that do not support most of the new technologies. By using only client-side Web applications, data cannot be easily collected from the user (unless the user emails the data to the server). The client's computer may cause all sorts of problems by being very slow or not having all necessary software and plug-ins installed. The only way the user can access data from the server is if the data is stored as an XML file.

12. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200512 Server-side Architecture You can build entire Web application using server-side technology only. When building server-side Web applications you can support any browser on any platform and you don't have to worry about the browsers differences. A server-side Web application performs all processing on the server and returns, to the user, HTML pages as the result. Because all processing is performed on the server and the user just displays the information without performing any logic or processing, the architecture is called thin client.

13. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200513 Server-side Architecture Applications Data collection: The user submits information to the server where is then processed and stored. Order processing: The user places an order and submits it to the server where his order is processed. Dynamically generated catalogues: Based on user's request the server dynamically generates an HTML page based on a catalogue. Dynamically generated status information: The server provides the user with an HTML page based the status of a process. Online bill payment: The user has the ability to pay bills without other human intervention. Data maintenance pages: The server provides the user tools to maintain his data, which is stored on a database.

14. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200514 Server-side Technologies HyperText Markup Language (HTML) Cascading Style Sheets (CSS) Common Gateway Interface (CGI) C/C++ Java Visual Basic Perl Active Server Pages (ASP) ASP.NET PHP Hypertext Processor (use to be known as Personal Home Page) JavaServer Pages (JSP)

15. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200515 Advantages of Server-side Architecture Access to databases No browser compatibility issues. XML and XSL can be processed on the server side without warring about browser features. Processing can be done fast (as long as the Web server is a state of the art machine).

16. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200516 Disadvantages of Server-side Architecture No client-side reactivity. Software applications (such as Internet Information Server or Apache) is required to execute server side components. The server may get overloaded with requests. Some times you need huge masses of data space to be able store user information.

17. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200517 Combined Architecture Combining the client and server side architectures can result in a very powerful Web application, as you can get the best from both. This type of architecture provides client-side processing for validation and interactivity and server-side processing for data entrance and dynamic creation of Web pages from databases.

18. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200518 Advantages of Combined Architecture Data can be validated before passed to the Web server. The validated data can be submitted and stored directly to a database. Data can be obtained from the database and dynamically create Web pages for presentation. Necessary scripts or client-side applications can be generated to the Web page and downloaded to the user. XML, XSL can be processed on the server before downloaded to the client's computer.

19. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200519 Disadvantages of Combined Architecture You need to be familiar with a wide range of client and server side languages, technologies, and techniques. Before you generate client side scripts on the server, you still need to know about differences on the Web browsers.

20. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200520 n-Tiered Architecture A tier is a logically separated and encapsulated set of processes. There are three basic parts: –The user interface tier (representation layer). –The data tier (server-side component), which is the database data processed by the Web application. –The middle tier (middle-tier component), which processes complex business processing (usually place on a separate server called the application server).

21. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200521 Middle-Tier Technologies The middle-tier application development is a separated and encapsulated set of processes usually related to business applications. The applications in the middle-tier are build as components which are accessed from the server-side components (data tier). Popular technologies for building middle-tier components are: the Component Object Model (COM) with C++ and VB, and the JavaBeans with Java The middle tier components are usually place on a separate server called the application server.

22. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200522 Advantages of n-Tiered Architecture The architecture and processing is more modular, which means that is easier to maintain and update. Is component based therefore you can build or buy third parity components that just plug into your application. The applications are usually compiled, therefore you gain performance. Components are reusable and can be used on other applications or by other organisations. You can control the load balancing of your application by splitting the functionality into tiers.

23. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200523 Disadvantages of n-Tiered Architecture n-tier applications requite lots of design to ensure integrity between the tiers. It can become very expensive as it requires more development time and more physical resources. More and more technologies to learn…

24. Introduction to Web Application Architectures 18 th March 2005Bogdan L. Vrusias © 200524 Closing Questions??? Remarks??? Comments!!! Evaluation!