SlideShare une entreprise Scribd logo
1  sur  24
Web Applications
Come of Age
Presented By : Gaurav Gawande
Insides
•
•
•
•
•
•
•
•
•

A Brief History of Web Development.
What is a Web App
Working of Web App
What is a Single Page Apps?
Examples
Why switch to Single Page Apps?
JavaScript Frame work
Advantages
Conclusion
The Web
Years of Development
• WWW 1st took off in mid 1990
• netScape introduce JavaScript In 1995

•

“Web App“ Servlets Specification version 2.2.
In 1999
The Web App
Web App : Allow user to
retrieve data
Browser : A Computer
program that allow
user to interact
with web.
REQUEST-RESPONSE
MODEL
Server side Script
The Person coding the
interface and the person
writing server side both
must have detail of each
others requirements.
But..
Very slow
&

Need to Reload Every
time
Consider Example..
Index.html

Greed.html

• Greed.html

• Details.html

Details.html
Not Any More..
Model Changed in mid2000
 2005 -- AJAX
Rise of Single Page
Application
• A single-page application (SPA), also known as
single-page interface (SPI), is a web application or
web site that fits on a single web site with the goal
of providing a more fluid user experience akin to a
desktop application.

..Wikipedia
Examples
Twitter

Google Mail
What is Single Page App.
•

As AJAX gained in popularity, we started
seeing a major reversal instead of

•

"dynamically-generated static web
pages"

•

"statically-generated dynamic web
pages"

•

This gave birth to something new:
serve simple static content and do all the
dynamic stuff with JavaScript.

•

In theory, you could run a whole app with
a single page load...
Key Difference
• Here’s a simple server-side web page template with
a PHP script that makes some
• SQL queries, plus HTML formatting for a table that
contains the results of those .
Request-Response Mode
Working
JavaScript Web App Mode
Working Of Java Script Model
JavaScript Frameworks
WHY USE SPA?
SPA PERFORMANCE
•
•
•
•
•
•
•
•

SPAs can improve performance in several ways:
Load time: 1 file each of HTML, CSS, JS,
static files not dynamic
Less data transfer: XHR calls only send
raw data, not HTML markup
Load distribution: dramatically less load
on your server, by distributing it to clients
Caching gets a lot easier and more beneficial
Final Thoughts
• !dea is simple
• Server Up the Base Presentation Document and
• Manipulate it with JS.
• All these benefits explain why developer may want
to develop next app on single page App.
<Thank You..!! >
Web Applications Come of Age: Understanding Single Page Apps

Contenu connexe

Tendances

Single Page Applications on JavaScript and ASP.NET MVC4
Single Page Applications on JavaScript and ASP.NET MVC4Single Page Applications on JavaScript and ASP.NET MVC4
Single Page Applications on JavaScript and ASP.NET MVC4Yuriy Shapovalov
 
Iseltech17 - Single Page Applications
Iseltech17 - Single Page ApplicationsIseltech17 - Single Page Applications
Iseltech17 - Single Page ApplicationsMonica Rodrigues
 
Server rendering-talk
Server rendering-talkServer rendering-talk
Server rendering-talkDaiwei Lu
 
Making Single Page Applications (SPA) faster
Making Single Page Applications (SPA) faster Making Single Page Applications (SPA) faster
Making Single Page Applications (SPA) faster Boris Livshutz
 
Pros and Cons of developing a Thick Clientside App
Pros and Cons of developing a Thick Clientside AppPros and Cons of developing a Thick Clientside App
Pros and Cons of developing a Thick Clientside AppRavi Teja
 
Web jobs, Azure Functions and Serverless Computing
Web jobs, Azure Functions and Serverless ComputingWeb jobs, Azure Functions and Serverless Computing
Web jobs, Azure Functions and Serverless ComputingParis Polyzos
 
Single page applications
Single page applicationsSingle page applications
Single page applicationsDiego Cardozo
 
Single Page Apps
Single Page AppsSingle Page Apps
Single Page AppsGil Fink
 
Client side vs server side
Client side vs server sideClient side vs server side
Client side vs server sideabgjim96
 
Host, deploy & scale Blazor Server Apps
Host, deploy & scale Blazor Server AppsHost, deploy & scale Blazor Server Apps
Host, deploy & scale Blazor Server AppsJose Javier Columbie
 
Deep Dive building solutions on the SharePoint Framework - SPS Brussels 2016
Deep Dive building solutions on the SharePoint Framework - SPS Brussels 2016Deep Dive building solutions on the SharePoint Framework - SPS Brussels 2016
Deep Dive building solutions on the SharePoint Framework - SPS Brussels 2016Waldek Mastykarz
 
Workflow driven development
Workflow driven developmentWorkflow driven development
Workflow driven developmentDmitryDemyankov
 
Office script labs
Office script labsOffice script labs
Office script labsMark Roden
 

Tendances (20)

Single Page Applications on JavaScript and ASP.NET MVC4
Single Page Applications on JavaScript and ASP.NET MVC4Single Page Applications on JavaScript and ASP.NET MVC4
Single Page Applications on JavaScript and ASP.NET MVC4
 
Iseltech17 - Single Page Applications
Iseltech17 - Single Page ApplicationsIseltech17 - Single Page Applications
Iseltech17 - Single Page Applications
 
Server rendering-talk
Server rendering-talkServer rendering-talk
Server rendering-talk
 
A Gentle Introduction to Blazor
A Gentle Introduction to BlazorA Gentle Introduction to Blazor
A Gentle Introduction to Blazor
 
Azure Serverless Conf
Azure Serverless ConfAzure Serverless Conf
Azure Serverless Conf
 
Making Single Page Applications (SPA) faster
Making Single Page Applications (SPA) faster Making Single Page Applications (SPA) faster
Making Single Page Applications (SPA) faster
 
Pros and Cons of developing a Thick Clientside App
Pros and Cons of developing a Thick Clientside AppPros and Cons of developing a Thick Clientside App
Pros and Cons of developing a Thick Clientside App
 
Web jobs, Azure Functions and Serverless Computing
Web jobs, Azure Functions and Serverless ComputingWeb jobs, Azure Functions and Serverless Computing
Web jobs, Azure Functions and Serverless Computing
 
Single page applications
Single page applicationsSingle page applications
Single page applications
 
Codegen2021 blazor mobile
Codegen2021 blazor mobileCodegen2021 blazor mobile
Codegen2021 blazor mobile
 
Single Page Apps
Single Page AppsSingle Page Apps
Single Page Apps
 
Client side vs server side
Client side vs server sideClient side vs server side
Client side vs server side
 
Host, deploy & scale Blazor Server Apps
Host, deploy & scale Blazor Server AppsHost, deploy & scale Blazor Server Apps
Host, deploy & scale Blazor Server Apps
 
Benefits of developing a Single Page Web Applications using AngularJS
Benefits of developing a Single Page Web Applications using AngularJSBenefits of developing a Single Page Web Applications using AngularJS
Benefits of developing a Single Page Web Applications using AngularJS
 
How to ease the learning curve
How to ease the learning curveHow to ease the learning curve
How to ease the learning curve
 
Deep Dive building solutions on the SharePoint Framework - SPS Brussels 2016
Deep Dive building solutions on the SharePoint Framework - SPS Brussels 2016Deep Dive building solutions on the SharePoint Framework - SPS Brussels 2016
Deep Dive building solutions on the SharePoint Framework - SPS Brussels 2016
 
Workflow driven development
Workflow driven developmentWorkflow driven development
Workflow driven development
 
Why XAF and XPO?
Why XAF and XPO?Why XAF and XPO?
Why XAF and XPO?
 
Office script labs
Office script labsOffice script labs
Office script labs
 
ASP.NET MVC 4
ASP.NET MVC 4ASP.NET MVC 4
ASP.NET MVC 4
 

Similaire à Web Applications Come of Age: Understanding Single Page Apps

Advanced Web Technology.pptx
Advanced Web Technology.pptxAdvanced Web Technology.pptx
Advanced Web Technology.pptxssuser35fdf2
 
introduction to js
introduction to jsintroduction to js
introduction to jsSireesh K
 
Rise and Fall of the Frontend Developer
Rise and Fall of the Frontend DeveloperRise and Fall of the Frontend Developer
Rise and Fall of the Frontend DeveloperRafael Casuso Romate
 
Escaping the yellow bubble - rewriting Domino using MongoDb and Angular
Escaping the yellow bubble - rewriting Domino using MongoDb and AngularEscaping the yellow bubble - rewriting Domino using MongoDb and Angular
Escaping the yellow bubble - rewriting Domino using MongoDb and AngularMark Leusink
 
Intro to SPA using JavaScript & ASP.NET
Intro to SPA using JavaScript & ASP.NETIntro to SPA using JavaScript & ASP.NET
Intro to SPA using JavaScript & ASP.NETAlan Hecht
 
Single Page Applications: Your Browser is the OS!
Single Page Applications: Your Browser is the OS!Single Page Applications: Your Browser is the OS!
Single Page Applications: Your Browser is the OS!Jeremy Likness
 
Isomorphic web application
Isomorphic web applicationIsomorphic web application
Isomorphic web applicationOliver N
 
Progressive Web Apps and React
Progressive Web Apps and ReactProgressive Web Apps and React
Progressive Web Apps and ReactMike Melusky
 
Ppt for Online music store
Ppt for Online music storePpt for Online music store
Ppt for Online music storeADEEBANADEEM
 
Isomorphic React Applications: Performance And Scalability
Isomorphic React Applications: Performance And ScalabilityIsomorphic React Applications: Performance And Scalability
Isomorphic React Applications: Performance And ScalabilityDenis Izmaylov
 
Building WordPress sites with AngularJS and the RESTful plugin JSON API @ Dev...
Building WordPress sites with AngularJS and the RESTful plugin JSON API @ Dev...Building WordPress sites with AngularJS and the RESTful plugin JSON API @ Dev...
Building WordPress sites with AngularJS and the RESTful plugin JSON API @ Dev...Eric Greene
 
How angularjs saves rails
How angularjs saves railsHow angularjs saves rails
How angularjs saves railsMichael He
 
Introduction tosinglepageapplications
Introduction tosinglepageapplicationsIntroduction tosinglepageapplications
Introduction tosinglepageapplicationsNabeel Khan
 
The Thick Front-End
The Thick Front-EndThe Thick Front-End
The Thick Front-EndJeff Dickey
 

Similaire à Web Applications Come of Age: Understanding Single Page Apps (20)

Javascript 01 (js)
Javascript 01 (js)Javascript 01 (js)
Javascript 01 (js)
 
Advanced Web Technology.pptx
Advanced Web Technology.pptxAdvanced Web Technology.pptx
Advanced Web Technology.pptx
 
Benefits of developing single page web applications using angular js
Benefits of developing single page web applications using angular jsBenefits of developing single page web applications using angular js
Benefits of developing single page web applications using angular js
 
introduction to js
introduction to jsintroduction to js
introduction to js
 
Rise and Fall of the Frontend Developer
Rise and Fall of the Frontend DeveloperRise and Fall of the Frontend Developer
Rise and Fall of the Frontend Developer
 
Client server 01
Client server 01Client server 01
Client server 01
 
Escaping the yellow bubble - rewriting Domino using MongoDb and Angular
Escaping the yellow bubble - rewriting Domino using MongoDb and AngularEscaping the yellow bubble - rewriting Domino using MongoDb and Angular
Escaping the yellow bubble - rewriting Domino using MongoDb and Angular
 
Intro to SPA using JavaScript & ASP.NET
Intro to SPA using JavaScript & ASP.NETIntro to SPA using JavaScript & ASP.NET
Intro to SPA using JavaScript & ASP.NET
 
Single Page Applications: Your Browser is the OS!
Single Page Applications: Your Browser is the OS!Single Page Applications: Your Browser is the OS!
Single Page Applications: Your Browser is the OS!
 
Isomorphic web application
Isomorphic web applicationIsomorphic web application
Isomorphic web application
 
Progressive Web Apps and React
Progressive Web Apps and ReactProgressive Web Apps and React
Progressive Web Apps and React
 
Ppt for Online music store
Ppt for Online music storePpt for Online music store
Ppt for Online music store
 
Isomorphic React Applications: Performance And Scalability
Isomorphic React Applications: Performance And ScalabilityIsomorphic React Applications: Performance And Scalability
Isomorphic React Applications: Performance And Scalability
 
Building WordPress sites with AngularJS and the RESTful plugin JSON API @ Dev...
Building WordPress sites with AngularJS and the RESTful plugin JSON API @ Dev...Building WordPress sites with AngularJS and the RESTful plugin JSON API @ Dev...
Building WordPress sites with AngularJS and the RESTful plugin JSON API @ Dev...
 
Evolution of java script libraries
Evolution of java script librariesEvolution of java script libraries
Evolution of java script libraries
 
How angularjs saves rails
How angularjs saves railsHow angularjs saves rails
How angularjs saves rails
 
React Tech Salon
React Tech SalonReact Tech Salon
React Tech Salon
 
Introduction tosinglepageapplications
Introduction tosinglepageapplicationsIntroduction tosinglepageapplications
Introduction tosinglepageapplications
 
Mean stack
Mean stackMean stack
Mean stack
 
The Thick Front-End
The Thick Front-EndThe Thick Front-End
The Thick Front-End
 

Dernier

Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon AUnboundStockton
 
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityParis 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityGeoBlogs
 
Arihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfArihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfchloefrazer622
 
MENTAL STATUS EXAMINATION format.docx
MENTAL     STATUS EXAMINATION format.docxMENTAL     STATUS EXAMINATION format.docx
MENTAL STATUS EXAMINATION format.docxPoojaSen20
 
mini mental status format.docx
mini    mental       status     format.docxmini    mental       status     format.docx
mini mental status format.docxPoojaSen20
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxiammrhaywood
 
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Krashi Coaching
 
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppURLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppCeline George
 
The basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxThe basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxheathfieldcps1
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxpboyjonauth
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Sapana Sha
 
PSYCHIATRIC History collection FORMAT.pptx
PSYCHIATRIC   History collection FORMAT.pptxPSYCHIATRIC   History collection FORMAT.pptx
PSYCHIATRIC History collection FORMAT.pptxPoojaSen20
 
Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentInMediaRes1
 
Concept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfConcept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfUmakantAnnand
 
Micromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersMicromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersChitralekhaTherkar
 
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3JemimahLaneBuaron
 
Hybridoma Technology ( Production , Purification , and Application )
Hybridoma Technology  ( Production , Purification , and Application  ) Hybridoma Technology  ( Production , Purification , and Application  )
Hybridoma Technology ( Production , Purification , and Application ) Sakshi Ghasle
 

Dernier (20)

Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon A
 
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityParis 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activity
 
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
 
Arihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfArihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdf
 
MENTAL STATUS EXAMINATION format.docx
MENTAL     STATUS EXAMINATION format.docxMENTAL     STATUS EXAMINATION format.docx
MENTAL STATUS EXAMINATION format.docx
 
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
 
mini mental status format.docx
mini    mental       status     format.docxmini    mental       status     format.docx
mini mental status format.docx
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
 
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
 
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppURLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website App
 
The basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxThe basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptx
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
 
PSYCHIATRIC History collection FORMAT.pptx
PSYCHIATRIC   History collection FORMAT.pptxPSYCHIATRIC   History collection FORMAT.pptx
PSYCHIATRIC History collection FORMAT.pptx
 
Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media Component
 
Concept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfConcept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.Compdf
 
Micromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersMicromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of Powders
 
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3
 
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdfTataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
 
Hybridoma Technology ( Production , Purification , and Application )
Hybridoma Technology  ( Production , Purification , and Application  ) Hybridoma Technology  ( Production , Purification , and Application  )
Hybridoma Technology ( Production , Purification , and Application )
 

Web Applications Come of Age: Understanding Single Page Apps