SlideShare a Scribd company logo
By SAFAL AGRAWAL
Why AJAX ?
 What is AJAX ?
Technologies Used In AJAX
Classic vs. AJAX
What is ASP.NET AJAX?
3-Tier Client/Server applications using AJAX.
ASP. Net AJAX Framework
Characteristics of Conventional Web Applications
Macromedia Flash
Real-Life Examples of AJAX AppsBy SAFAL AGRAWAL
 Intuitive and natural user interaction
No clicking required
Mouse movement is a sufficient event trigger
 "Partial screen update" replaces the
"click, wait, & refresh" user interaction model
 Only user interface elements that contain new
information are updated asynchronously
 The rest of the user interface remains
displayed without interruption
By SAFAL AGRAWAL
Standards-based presentation using
XHTML and CSS
Dynamic display and interaction
Using the Document Object Model
Data Interchange and Manipulation using XML
and XSLT
Asynchronous data retrieval using
XMLHttpRequest
JavaScript binding everything together
By SAFAL AGRAWAL
AJAX Uses HTTP Requests
With AJAX, your JavaScript communicates
directly with the server, through the JavaScript
XMLHttpRequest object
With an HTTP request, a web page can make a
request to, and get a response from a web server -
without reloading the page. The user will stay on
the same page, and he or she will not notice that
scripts request pages, or send data to a server in
the background.
By SAFAL AGRAWAL
JavaScript
Loosely typed scripting language
 JavaScript function is called when an event in a page occurs
 Glue for the whole AJAX operation
DOM
Represents the structure of XML and HTML documents
API for accessing and manipulating structured documents
CSS
Allows for a clear separation of the presentation style from the
content and may be changed programmatically by JavaScript
XMLHttpRequest
JavaScript object that performs asynchronous interaction with
the server By SAFAL AGRAWAL
Scripting language
Dynamic and weakly typed
Prototype-based with first-class functions
Semantics similar to functional languages
Standardized as ECMAScript
Supported by most modern browsers
But sometimes disabled for security reasons
Although standardized, browser-specific issues
exist
By SAFAL AGRAWAL
Object Oriented Representation for XML and
HTML documents
Based on Hierarchical (Tree) Structure
Allows programs and scripts to build
documents, navigate their structure, add,
modify or delete elements and contents
Provides a foundation for developing querying,
filtering, transformation, rendering etc.
applications on top of DOM implementations
By SAFAL AGRAWAL
Set of Formatting rules that tell the browser how
to present the document
Helps to separate the content from the
presentation
Reduce the download time by removing the
formatting information from the document
More control over formatting than HTML
By SAFAL AGRAWAL
A JavaScript Class that lets you make
asynchronous HTTP requests from JavaScript
Make an HTTP request from a JavaScript event
A call back JavaScript function is invoked at each
state of the HTTP request & response
First introduced by MS as an ActiveX object
Some XMLHttpRequest Methods
Open:
Specify the HTTP method, URL and async/sync
Send:
Initiates the request. Can also specify POST data
By SAFAL AGRAWAL
OnReadyStateChange - call back function for
state changes
ReadyState - the current state of the HTTP call
ResponseText - the text result of the request
ResponseXML - DOM xml object from the
request
Status - HTTP status code of the response
StatusText - HTTP status text
By SAFAL AGRAWAL
By SAFAL AGRAWAL
High Productivity AJAX Development Framework
Fewer concepts, fewer lines of code
Application and UI building blocks for common
scenarios
Works/builds on Top of ASP.NET.
Easy to Author, Debug, and Maintain
Clean separation of content, style, behavior, & code
Well integrated with design and development tools
Seamlessly integrated application model
Works with ASP.NET pages and server controls
Allows access to ASP.NET web services &
components
Standards-Based: Works Cross-Browser!
A Framework for building Richer, more
Interactive, Standards-based Web Experiences
By SAFAL AGRAWAL
By SAFAL AGRAWAL
Desktop application “Look and Feel”
Richer user interactions
Improved scalability
Increased responsiveness
Richer application functionality
Better end-user experiences
Decreased bandwidth utilization
More rapid user feedback
By SAFAL AGRAWAL
Scenarios
Mash-up and composite applications and sites
Components and Gadgets (Live.com, Windows Sidebar)
Powerful script framework
Rich type system and class library for JavaScript
Component model and UI framework
Rich client-side data access and data binding
Easily integrated with server application model
Easily consume web services from browser
Script access to ASP.NET application services
Server-side bridge to reuse 3rd party services
By SAFAL AGRAWAL
Server-centric web sites and apps
 Work with existing server application model
Keep core UI/application logic on server
 Improve latency, interactivity, personalization
Client-centric browser applications
 Fully exploit DHTML in presentation tier
 The DOM is back … never went away ;-)
 Use AJAX for data, services, composition
 Enable new immersive experiences
ASP.net AJAX provides a great framework for
both
By SAFAL AGRAWAL
By SAFAL AGRAWAL
The client architecture includes libraries for
component support, Browser compatibility,
Networking, and Core services.
Client components enable rich behaviors in the
browser without PostBacks
Components, which are non-visual objects that
encapsulate code.
Behaviors, which extend the behavior of existing
DOM elements.
Controls, which represent a new DOM element
that has custom behavior.By SAFAL AGRAWAL
By SAFAL AGRAWAL
The server pieces that support Ajax development
consist of ASP.NET Web server controls and
components that manage the UI and flow of an
application.
The server pieces also manage serialization,
validation, and control extensibility.
 There are also ASP.NET Web services that enable
you to access ASP.NET application services for
forms authentication, roles, and user profiles.
Partial-page rendering, which updates regions of the
page by using an asynchronous PostBack.
By SAFAL AGRAWAL
“Click, wait, and refresh” user interaction
Any communication with the server forces a page
refresh
Synchronous “request/response” communication
model
The user has to wait for the response
Page-driven: Workflow is based on pages
Page-navigation logic is determined by the server
By SAFAL AGRAWAL
Navigation & control
Easier movement within or between Websites
Searching
Improved search engine capabilities
Communication
Aids for human-to-human and human-to-computer
interaction
Web services
Ajax is useful for supporting Service-Oriented
Architectures (SOA)
System tasks
Background tasks not directly apparent to the user
By SAFAL AGRAWAL
Designed for playing interactive movies
 Programmed with ActionScript
 Implementation examples
Macromedia Flex
Laszlo suite (open source)
Pros:
Good for vector graphics
Cons:
Browser needs a Flash plug-in
ActionScript is proprietary and hard to debug
By SAFAL AGRAWAL
No plug-ins for AJAX
Flash development tools cost money
Flash typically has slower page load time
Flash can work on older browsers
ActionScript doesn't have a cross
Browser Issues
Flash can access other domains if
There is a crossdomain.xml file
By SAFAL AGRAWAL
By SAFAL AGRAWAL
By SAFAL AGRAWAL
A user can drag the entire map by using the
mouse
Instead of clicking on a button or something
The action that triggers the download of new
map data is not a specific click on a link but a
moving the map around with a mouse
Behind the scene - AJAX is used
The map data is requested and downloaded
asynchronously in the background
Other parts of the page remains the same
No loss of operational context
By SAFAL AGRAWAL
Simple navigation & control
Simple search tasks
Non-Synchronizable system tasks
By SAFAL AGRAWAL
AJAX represents a generic application model
that would enable more interactive, more
responsive, and smarter Web applications.
AJAX is not tied to a particular programming
language, data format, or network object and
is defined by two core attributes: partial
screen update and asynchronous
communication.
By SAFAL AGRAWAL
http://www.Google.com
http://msdn.microsoft.com/en-us/library
/ee341002.aspx
http://jquery.com
http://www.Bing.com
http://www.asp.net
http://www.a jax.org
http://en.wikip edia.org/wiki/AJAX
By SAFAL AGRAWAL
By SAFAL AGRAWAL

More Related Content

What's hot

Ajax
AjaxAjax
Ajax Introduction Presentation
Ajax   Introduction   PresentationAjax   Introduction   Presentation
Ajax Introduction Presentationthinkphp
 
Ajax PPT
Ajax PPTAjax PPT
Ajax PPT
Hub4Tech.com
 
Ajax
AjaxAjax
AJAX
AJAXAJAX
Intoduction to Ajax
Intoduction to AjaxIntoduction to Ajax
Intoduction to Ajax
RISHAV ANURAG
 
AJAX in ASP.NET
AJAX in ASP.NETAJAX in ASP.NET
AJAX in ASP.NET
James Crowley
 
Web 2.0 & Ajax Basics
Web 2.0 & Ajax BasicsWeb 2.0 & Ajax Basics
Web 2.0 & Ajax Basics
Abhishek Nagar
 
Ajax & ASP.NET 2
Ajax & ASP.NET 2Ajax & ASP.NET 2
Ajax & ASP.NET 2
Talal Alsubaie
 
Ajax and RJS
Ajax and RJSAjax and RJS
Ajax and RJS
Dominiek ter Heide
 
Ajax for Libraries
Ajax for LibrariesAjax for Libraries
Ajax for Librariesguest5aa3e8
 
Beyond HTML: Tools for Building Web 2.0 Apps
Beyond HTML: Tools for Building Web 2.0 AppsBeyond HTML: Tools for Building Web 2.0 Apps
Beyond HTML: Tools for Building Web 2.0 Apps
Marcos Caceres
 
Ajax
AjaxAjax
Ajax Using JSP with prototype.js
Ajax Using JSP with prototype.jsAjax Using JSP with prototype.js
Ajax Using JSP with prototype.js
Tushar Chauhan
 

What's hot (20)

Ajax
AjaxAjax
Ajax
 
Ajax Introduction Presentation
Ajax   Introduction   PresentationAjax   Introduction   Presentation
Ajax Introduction Presentation
 
Ajax PPT
Ajax PPTAjax PPT
Ajax PPT
 
Ajax
AjaxAjax
Ajax
 
Ajax
AjaxAjax
Ajax
 
Ajax
AjaxAjax
Ajax
 
AJAX
AJAXAJAX
AJAX
 
Ajax
AjaxAjax
Ajax
 
Ajax
AjaxAjax
Ajax
 
Intoduction to Ajax
Intoduction to AjaxIntoduction to Ajax
Intoduction to Ajax
 
AJAX in ASP.NET
AJAX in ASP.NETAJAX in ASP.NET
AJAX in ASP.NET
 
Ajax and ASP.NET AJAX
Ajax and ASP.NET AJAXAjax and ASP.NET AJAX
Ajax and ASP.NET AJAX
 
Web 2.0 & Ajax Basics
Web 2.0 & Ajax BasicsWeb 2.0 & Ajax Basics
Web 2.0 & Ajax Basics
 
Ajax & ASP.NET 2
Ajax & ASP.NET 2Ajax & ASP.NET 2
Ajax & ASP.NET 2
 
Ajax and RJS
Ajax and RJSAjax and RJS
Ajax and RJS
 
Ajax part i
Ajax part iAjax part i
Ajax part i
 
Ajax for Libraries
Ajax for LibrariesAjax for Libraries
Ajax for Libraries
 
Beyond HTML: Tools for Building Web 2.0 Apps
Beyond HTML: Tools for Building Web 2.0 AppsBeyond HTML: Tools for Building Web 2.0 Apps
Beyond HTML: Tools for Building Web 2.0 Apps
 
Ajax
AjaxAjax
Ajax
 
Ajax Using JSP with prototype.js
Ajax Using JSP with prototype.jsAjax Using JSP with prototype.js
Ajax Using JSP with prototype.js
 

Similar to Ajax technology

Ajax Basics And Framework
Ajax Basics And FrameworkAjax Basics And Framework
Ajax Basics And Frameworkshivas
 
Lessons from the Trenches: Engineering Great AJAX Experiences
Lessons from the Trenches: Engineering Great AJAX ExperiencesLessons from the Trenches: Engineering Great AJAX Experiences
Lessons from the Trenches: Engineering Great AJAX Experiences
goodfriday
 
Ajax & Reverse Ajax Presenation
Ajax & Reverse Ajax PresenationAjax & Reverse Ajax Presenation
Ajax & Reverse Ajax Presenation
Rishabh Garg
 
Ajax presentation
Ajax presentationAjax presentation
Ajax presentation
Bharat_Kumawat
 
New microsoft office power point presentation
New microsoft office power point presentationNew microsoft office power point presentation
New microsoft office power point presentation
teach4uin
 
Developing a Better User Experience with "Atlas"
Developing a Better User Experience with "Atlas"Developing a Better User Experience with "Atlas"
Developing a Better User Experience with "Atlas"
goodfriday
 
Ajax: User Experience
Ajax: User ExperienceAjax: User Experience
Ajax: User Experiencepetrov
 
AJAX Patterns with ASP.NET
AJAX Patterns with ASP.NETAJAX Patterns with ASP.NET
AJAX Patterns with ASP.NET
goodfriday
 
4005-713 ` XML Architecture, Tools & Technique ` Presentation
4005-713 ` XML Architecture, Tools & Technique ` Presentation4005-713 ` XML Architecture, Tools & Technique ` Presentation
4005-713 ` XML Architecture, Tools & Technique ` Presentationlitcigar
 
Ajax ppt
Ajax pptAjax ppt
25250716 seminar-on-ajax text
25250716 seminar-on-ajax text25250716 seminar-on-ajax text
25250716 seminar-on-ajax text
Kamleshh Chandnani
 
Progressive Web-App (PWA)
Progressive Web-App (PWA)Progressive Web-App (PWA)
Progressive Web-App (PWA)
NexThoughts Technologies
 
SynapseIndia asp.net2.0 ajax Development
SynapseIndia asp.net2.0 ajax DevelopmentSynapseIndia asp.net2.0 ajax Development
SynapseIndia asp.net2.0 ajax Development
Synapseindiappsdevelopment
 
Ajax
AjaxAjax
Ajax ppt - 32 slides
Ajax ppt - 32 slidesAjax ppt - 32 slides
Ajax ppt - 32 slides
Smithss25
 
single page application
single page applicationsingle page application
single page application
Ravindra K
 

Similar to Ajax technology (20)

Ajax Basics And Framework
Ajax Basics And FrameworkAjax Basics And Framework
Ajax Basics And Framework
 
Lessons
LessonsLessons
Lessons
 
Lessons from the Trenches: Engineering Great AJAX Experiences
Lessons from the Trenches: Engineering Great AJAX ExperiencesLessons from the Trenches: Engineering Great AJAX Experiences
Lessons from the Trenches: Engineering Great AJAX Experiences
 
Ajax & Reverse Ajax Presenation
Ajax & Reverse Ajax PresenationAjax & Reverse Ajax Presenation
Ajax & Reverse Ajax Presenation
 
Ajax presentation
Ajax presentationAjax presentation
Ajax presentation
 
New microsoft office power point presentation
New microsoft office power point presentationNew microsoft office power point presentation
New microsoft office power point presentation
 
Ajax
AjaxAjax
Ajax
 
Developing a Better User Experience with "Atlas"
Developing a Better User Experience with "Atlas"Developing a Better User Experience with "Atlas"
Developing a Better User Experience with "Atlas"
 
Ajax: User Experience
Ajax: User ExperienceAjax: User Experience
Ajax: User Experience
 
AJAX Patterns with ASP.NET
AJAX Patterns with ASP.NETAJAX Patterns with ASP.NET
AJAX Patterns with ASP.NET
 
Ajax
AjaxAjax
Ajax
 
4005-713 ` XML Architecture, Tools & Technique ` Presentation
4005-713 ` XML Architecture, Tools & Technique ` Presentation4005-713 ` XML Architecture, Tools & Technique ` Presentation
4005-713 ` XML Architecture, Tools & Technique ` Presentation
 
Ajax ppt
Ajax pptAjax ppt
Ajax ppt
 
25250716 seminar-on-ajax text
25250716 seminar-on-ajax text25250716 seminar-on-ajax text
25250716 seminar-on-ajax text
 
Progressive Web-App (PWA)
Progressive Web-App (PWA)Progressive Web-App (PWA)
Progressive Web-App (PWA)
 
SynapseIndia asp.net2.0 ajax Development
SynapseIndia asp.net2.0 ajax DevelopmentSynapseIndia asp.net2.0 ajax Development
SynapseIndia asp.net2.0 ajax Development
 
Ajax
AjaxAjax
Ajax
 
Ajax ppt - 32 slides
Ajax ppt - 32 slidesAjax ppt - 32 slides
Ajax ppt - 32 slides
 
single page application
single page applicationsingle page application
single page application
 
MVC
MVCMVC
MVC
 

Recently uploaded

Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
ThousandEyes
 
Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with Parameters
Safe Software
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
DianaGray10
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
91mobiles
 
КАТЕРИНА АБЗЯТОВА «Ефективне планування тестування ключові аспекти та практ...
КАТЕРИНА АБЗЯТОВА  «Ефективне планування тестування  ключові аспекти та практ...КАТЕРИНА АБЗЯТОВА  «Ефективне планування тестування  ключові аспекти та практ...
КАТЕРИНА АБЗЯТОВА «Ефективне планування тестування ключові аспекти та практ...
QADay
 
НАДІЯ ФЕДЮШКО БАЦ «Професійне зростання QA спеціаліста»
НАДІЯ ФЕДЮШКО БАЦ  «Професійне зростання QA спеціаліста»НАДІЯ ФЕДЮШКО БАЦ  «Професійне зростання QA спеціаліста»
НАДІЯ ФЕДЮШКО БАЦ «Професійне зростання QA спеціаліста»
QADay
 
PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
Ralf Eggert
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
DianaGray10
 
UiPath New York Community Day in-person event
UiPath New York Community Day in-person eventUiPath New York Community Day in-person event
UiPath New York Community Day in-person event
DianaGray10
 
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
Product School
 
Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*
Frank van Harmelen
 
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualitySoftware Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Inflectra
 
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Peter Udo Diehl
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
Product School
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Ramesh Iyer
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
Thijs Feryn
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
Product School
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
BookNet Canada
 
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptxIOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
Abida Shariff
 

Recently uploaded (20)

Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
 
Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with Parameters
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
 
КАТЕРИНА АБЗЯТОВА «Ефективне планування тестування ключові аспекти та практ...
КАТЕРИНА АБЗЯТОВА  «Ефективне планування тестування  ключові аспекти та практ...КАТЕРИНА АБЗЯТОВА  «Ефективне планування тестування  ключові аспекти та практ...
КАТЕРИНА АБЗЯТОВА «Ефективне планування тестування ключові аспекти та практ...
 
НАДІЯ ФЕДЮШКО БАЦ «Професійне зростання QA спеціаліста»
НАДІЯ ФЕДЮШКО БАЦ  «Професійне зростання QA спеціаліста»НАДІЯ ФЕДЮШКО БАЦ  «Професійне зростання QA спеціаліста»
НАДІЯ ФЕДЮШКО БАЦ «Професійне зростання QA спеціаліста»
 
PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
 
UiPath New York Community Day in-person event
UiPath New York Community Day in-person eventUiPath New York Community Day in-person event
UiPath New York Community Day in-person event
 
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
 
Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*
 
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualitySoftware Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
 
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
 
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptxIOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
 

Ajax technology

  • 2. Why AJAX ?  What is AJAX ? Technologies Used In AJAX Classic vs. AJAX What is ASP.NET AJAX? 3-Tier Client/Server applications using AJAX. ASP. Net AJAX Framework Characteristics of Conventional Web Applications Macromedia Flash Real-Life Examples of AJAX AppsBy SAFAL AGRAWAL
  • 3.  Intuitive and natural user interaction No clicking required Mouse movement is a sufficient event trigger  "Partial screen update" replaces the "click, wait, & refresh" user interaction model  Only user interface elements that contain new information are updated asynchronously  The rest of the user interface remains displayed without interruption By SAFAL AGRAWAL
  • 4. Standards-based presentation using XHTML and CSS Dynamic display and interaction Using the Document Object Model Data Interchange and Manipulation using XML and XSLT Asynchronous data retrieval using XMLHttpRequest JavaScript binding everything together By SAFAL AGRAWAL
  • 5. AJAX Uses HTTP Requests With AJAX, your JavaScript communicates directly with the server, through the JavaScript XMLHttpRequest object With an HTTP request, a web page can make a request to, and get a response from a web server - without reloading the page. The user will stay on the same page, and he or she will not notice that scripts request pages, or send data to a server in the background. By SAFAL AGRAWAL
  • 6. JavaScript Loosely typed scripting language  JavaScript function is called when an event in a page occurs  Glue for the whole AJAX operation DOM Represents the structure of XML and HTML documents API for accessing and manipulating structured documents CSS Allows for a clear separation of the presentation style from the content and may be changed programmatically by JavaScript XMLHttpRequest JavaScript object that performs asynchronous interaction with the server By SAFAL AGRAWAL
  • 7. Scripting language Dynamic and weakly typed Prototype-based with first-class functions Semantics similar to functional languages Standardized as ECMAScript Supported by most modern browsers But sometimes disabled for security reasons Although standardized, browser-specific issues exist By SAFAL AGRAWAL
  • 8. Object Oriented Representation for XML and HTML documents Based on Hierarchical (Tree) Structure Allows programs and scripts to build documents, navigate their structure, add, modify or delete elements and contents Provides a foundation for developing querying, filtering, transformation, rendering etc. applications on top of DOM implementations By SAFAL AGRAWAL
  • 9. Set of Formatting rules that tell the browser how to present the document Helps to separate the content from the presentation Reduce the download time by removing the formatting information from the document More control over formatting than HTML By SAFAL AGRAWAL
  • 10. A JavaScript Class that lets you make asynchronous HTTP requests from JavaScript Make an HTTP request from a JavaScript event A call back JavaScript function is invoked at each state of the HTTP request & response First introduced by MS as an ActiveX object Some XMLHttpRequest Methods Open: Specify the HTTP method, URL and async/sync Send: Initiates the request. Can also specify POST data By SAFAL AGRAWAL
  • 11. OnReadyStateChange - call back function for state changes ReadyState - the current state of the HTTP call ResponseText - the text result of the request ResponseXML - DOM xml object from the request Status - HTTP status code of the response StatusText - HTTP status text By SAFAL AGRAWAL
  • 13. High Productivity AJAX Development Framework Fewer concepts, fewer lines of code Application and UI building blocks for common scenarios Works/builds on Top of ASP.NET. Easy to Author, Debug, and Maintain Clean separation of content, style, behavior, & code Well integrated with design and development tools Seamlessly integrated application model Works with ASP.NET pages and server controls Allows access to ASP.NET web services & components Standards-Based: Works Cross-Browser! A Framework for building Richer, more Interactive, Standards-based Web Experiences By SAFAL AGRAWAL
  • 15. Desktop application “Look and Feel” Richer user interactions Improved scalability Increased responsiveness Richer application functionality Better end-user experiences Decreased bandwidth utilization More rapid user feedback By SAFAL AGRAWAL
  • 16. Scenarios Mash-up and composite applications and sites Components and Gadgets (Live.com, Windows Sidebar) Powerful script framework Rich type system and class library for JavaScript Component model and UI framework Rich client-side data access and data binding Easily integrated with server application model Easily consume web services from browser Script access to ASP.NET application services Server-side bridge to reuse 3rd party services By SAFAL AGRAWAL
  • 17. Server-centric web sites and apps  Work with existing server application model Keep core UI/application logic on server  Improve latency, interactivity, personalization Client-centric browser applications  Fully exploit DHTML in presentation tier  The DOM is back … never went away ;-)  Use AJAX for data, services, composition  Enable new immersive experiences ASP.net AJAX provides a great framework for both By SAFAL AGRAWAL
  • 19. The client architecture includes libraries for component support, Browser compatibility, Networking, and Core services. Client components enable rich behaviors in the browser without PostBacks Components, which are non-visual objects that encapsulate code. Behaviors, which extend the behavior of existing DOM elements. Controls, which represent a new DOM element that has custom behavior.By SAFAL AGRAWAL
  • 21. The server pieces that support Ajax development consist of ASP.NET Web server controls and components that manage the UI and flow of an application. The server pieces also manage serialization, validation, and control extensibility.  There are also ASP.NET Web services that enable you to access ASP.NET application services for forms authentication, roles, and user profiles. Partial-page rendering, which updates regions of the page by using an asynchronous PostBack. By SAFAL AGRAWAL
  • 22. “Click, wait, and refresh” user interaction Any communication with the server forces a page refresh Synchronous “request/response” communication model The user has to wait for the response Page-driven: Workflow is based on pages Page-navigation logic is determined by the server By SAFAL AGRAWAL
  • 23. Navigation & control Easier movement within or between Websites Searching Improved search engine capabilities Communication Aids for human-to-human and human-to-computer interaction Web services Ajax is useful for supporting Service-Oriented Architectures (SOA) System tasks Background tasks not directly apparent to the user By SAFAL AGRAWAL
  • 24. Designed for playing interactive movies  Programmed with ActionScript  Implementation examples Macromedia Flex Laszlo suite (open source) Pros: Good for vector graphics Cons: Browser needs a Flash plug-in ActionScript is proprietary and hard to debug By SAFAL AGRAWAL
  • 25. No plug-ins for AJAX Flash development tools cost money Flash typically has slower page load time Flash can work on older browsers ActionScript doesn't have a cross Browser Issues Flash can access other domains if There is a crossdomain.xml file By SAFAL AGRAWAL
  • 28. A user can drag the entire map by using the mouse Instead of clicking on a button or something The action that triggers the download of new map data is not a specific click on a link but a moving the map around with a mouse Behind the scene - AJAX is used The map data is requested and downloaded asynchronously in the background Other parts of the page remains the same No loss of operational context By SAFAL AGRAWAL
  • 29. Simple navigation & control Simple search tasks Non-Synchronizable system tasks By SAFAL AGRAWAL
  • 30. AJAX represents a generic application model that would enable more interactive, more responsive, and smarter Web applications. AJAX is not tied to a particular programming language, data format, or network object and is defined by two core attributes: partial screen update and asynchronous communication. By SAFAL AGRAWAL