Presentation is loading. Please wait.

Presentation is loading. Please wait.

1 AJAX and Dapper: The Good, the Bad, and the Ugly Joe Sirott PMEL/NOAA.

Published byShannon Shaw Modified over 8 years ago

Similar presentations

Presentation on theme: "1 AJAX and Dapper: The Good, the Bad, and the Ugly Joe Sirott PMEL/NOAA."— Presentation transcript:

1 1 AJAX and Dapper: The Good, the Bad, and the Ugly Joe Sirott PMEL/NOAA

2 2 What is Dapper? Web server that provides distributed access to in-situ data via OPeNDAP protocol Clients include GrADS, Matlab, NcBrowse, Java Ocean Atlas Available data: –PMEL EPIC database –ARGO profiles –NODC World Ocean Database 2001 All components are open-source

3 3 What is OPeNDAP? OPeNDAP (Open source Project for a Network Data Access Protocol) is a protocol for remotely accessing scientific data Uses HTTP as transport

4 4 What does Dapper do? Efficiently aggregates thousands of in-situ data files (>2000000 for WODB2001) Handles several in-situ data formats: –Argo GDAC netCDF –PMEL EPIC netCDF –COARDS compliant netCDF Supports time series or profiles Supports space/time queries Based on HPCC funded Climate Data Portal (Soreide, Zhu, Denbo)

5 5 Dapper architectural overview Uses relational database to store metadata and coordinate boundaries for each profile/time series file Data maintained in original format All data delivered as OPeNDAP sequences

6 6 Dapper architecture CORBA (IIOP) Climate Data Portal MySQL Java netCDF library netCDF profile netCDF profile Dapper HTTP Server CDP service netCDF service OPeNDAP client DChart OPeNDAP Protocol (HTTP) Database loader

7 7 But… OPeNDAP in-situ data is poor stepchild of OPeNDAP gridded data Few desktop clients support it Even fewer Web apps support it Some recent progress (GrADS, Java OceanAtlas) but change is slow

8 8 DChart Browser based in-situ OPeNDAP client Based on FY2004 HPCC funded project for shipboard display of cruise data AJAX based user interface

9 9 DChart Design Goals Highly responsive browser based user interface Low learning curve Rapid previewing and downloading of Dapper datasets Highly interactive map for region selection No Java applets or proprietary plug-ins

10 10 Dapper architecture diagram CORBA (IIOP) Climate Data Portal MySQL Java netCDF library netCDF profile netCDF profile Dapper HTTP Server CDP service netCDF service OPeNDAP client DChart OPeNDAP Protocol (HTTP) Database loader

11 11 DChart architecture Web Browser JavaScript DChart ServletDapper OPeNDAP Protocol (HTTP) XML/JavaScript (HTTP) JFreeChart SGT OPeNDAP Client XML Engine

12 12 DChart Demo NDBC video Argo video NDBC video Argo video NDBC video Argo video

13 13 What is AJAX? Buzzword == AJAX == Asynchronous Java and XML == Remote Scripting First idea: Replace synchronous requests to server with asynchronous requests Second idea: Use JavaScript to create/change user interface

14 14 Traditional Web App (from Adaptive Path)

15 15 AJAX Web App (from Adaptive Path)

16 16 JavaScript and AJAX 1. JavaScript uses XmlHttpRequest object to asynchronously request XML from server GET http://example.com/dchart?action=datasets http://example.com/dchart?action=datasets <scichart> argo Argo profiles argo Argo profiles </scichart>

17 17 JavaScript and AJAX 2. XSLT used to transform XML to HTML fragment when XML arrives at browser: <scichart> argo Argo profiles argo Argo profiles </scichart>

18 18 JavaScript and AJAX 2. XSLT used to transform XML to HTML fragment when XML arrives at browser: Argo Profiles Argo Profiles</a>

19 19 JavaScript and AJAX 3. DOM used to insert HTML fragment in HTML page: <html>… Argo Profiles Argo Profiles <html>

20 20 Good stuff Much more responsive user interface Desktop application functionality in familiar Web browser interface Client responsible for state management Zero effort software updates (for users!) “Cool” factor

21 21 Bad stuff Requires “modern” browser –DChart support currently limited to IE 6, Firefox 1.0.x, Mozilla –Covers > 90% of users and alternative would be downloading desktop app Debugging is difficult A lot for developers to learn: –XML,XPath,XSLT,JavaScript, CSS, DHTML, DOM… Libraries/frameworks immature Maintenance and testing difficult

22 22 And the ugly… Browser incompatibilities still an issue: –GET limited to 2048 characters in IE –IE window coordinate system different than Firefox –IE memory leaks Legacy ActiveX reference counting Transparent images with alpha channel –Disappearing DOM nodes with XSLT in IE Ugly kludges required: –GET/POST through Iframe to retain history

23 23 Future plans Constraints (QC flags, attributes) Multiple plot windows Save/restore Web app state More datasets

24 24 Lessons Learned Desktop applications are moving to the browser. It’s easier to move data to servers than servers to data. The response time of the back end is critical in AJAX applications. It takes a lot more time to develop the back end than the user interface.

25 25 Questions?

26 26 More info PMEL Dapper Server http://dapper.pmel.noaa.gov/dapper PMEL Dapper UI http://dapper.pmel.noaa.gov/dchart Downloads, propaganda http:// www.epic.noaa.gov/epic/software/dapper / http:// www.epic.noaa.gov/epic/software/dapper /Joe.Sirott@noaa.gov

27 27 Back

28 28 Back

Download ppt "1 AJAX and Dapper: The Good, the Bad, and the Ugly Joe Sirott PMEL/NOAA."

Similar presentations

The Live Access Server (Access to observational data) Jonathan Callahan (University of Washington) Steve Hankin (NOAA/PMEL – PI) Roland Schweitzer, Kevin.

The Live Access Server (Access to observational data) Jonathan Callahan (University of Washington) Steve Hankin (NOAA/PMEL – PI) Roland Schweitzer, Kevin.
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved Lesson 4: Web Browsing.

Copyright © 2012 Certification Partners, LLC -- All Rights Reserved Lesson 4: Web Browsing.
Cloud Computing Lecture #7 Introduction to Ajax Jimmy Lin The iSchool University of Maryland Wednesday, October 15, 2008 This work is licensed under a.

Cloud Computing Lecture #7 Introduction to Ajax Jimmy Lin The iSchool University of Maryland Wednesday, October 15, 2008 This work is licensed under a.
Multiple Tiers in Action

Multiple Tiers in Action
Microsoft ASP.NET AJAX - AJAX as it has to be Presented by : Rana Vijayasimha Nalla CSCE Grad Student.

Microsoft ASP.NET AJAX - AJAX as it has to be Presented by : Rana Vijayasimha Nalla CSCE Grad Student.
ITWS-2210 / CSCI-4963. Logistics Format – Class w/ mini projects (graded on class participation) – Labs (individual projects, graded on completion in.

ITWS-2210 / CSCI Logistics Format – Class w/ mini projects (graded on class participation) – Labs (individual projects, graded on completion in.
Web-based Portal for Discovery, Retrieval and Visualization of Earth Science Datasets in Grid Environment Zhenping (Jane) Liu.

Web-based Portal for Discovery, Retrieval and Visualization of Earth Science Datasets in Grid Environment Zhenping (Jane) Liu.
A closer look Dynamic Webpages Jessica Meyerson March 1, 2011.

A closer look Dynamic Webpages Jessica Meyerson March 1, 2011.
Client/Server Architectures

Client/Server Architectures
Tools for accessing distributed in-situ data collections Donald W. Denbo, NOAA/PMEL-JISAO Jason E. Fabritz, NOAA/PMEL-JISAO Bernard J. Kilonsky, Sea Level.

Tools for accessing distributed in-situ data collections Donald W. Denbo, NOAA/PMEL-JISAO Jason E. Fabritz, NOAA/PMEL-JISAO Bernard J. Kilonsky, Sea Level.
WHAT IS A WEB APP? Van Kelly Yeshiva University July 6, 2013.

WHAT IS A WEB APP? Van Kelly Yeshiva University July 6, 2013.
Beyond DHTML So far we have seen and used: CGI programs (using Perl ) and SSI on server side Java Script, VB Script, CSS and DOM on client side. For some.

Beyond DHTML So far we have seen and used: CGI programs (using Perl ) and SSI on server side Java Script, VB Script, CSS and DOM on client side. For some.
Ruth Betcher Ruth Christie

Ruth Betcher Ruth Christie
GIS technologies and Web Mapping Services

GIS technologies and Web Mapping Services
AJAX By Steven Hernandez Research Analyst NIATEC.

AJAX By Steven Hernandez Research Analyst NIATEC.
ASP.NET + Ajax Jesper Tørresø ITNET2 F08. Ajax Ajax (Asynchronous JavaScript and XML) A group of interrelated web development techniques used for creating.

ASP.NET + Ajax Jesper Tørresø ITNET2 F08. Ajax Ajax (Asynchronous JavaScript and XML) A group of interrelated web development techniques used for creating.
AJAX Without the “J” George Lawniczak. What is Ajax?

AJAX Without the “J” George Lawniczak. What is Ajax?
JavaScript, Fourth Edition Chapter 12 Updating Web Pages with AJAX.

JavaScript, Fourth Edition Chapter 12 Updating Web Pages with AJAX.
XP New Perspectives on XML, 2 nd Edition Tutorial 10 1 WORKING WITH THE DOCUMENT OBJECT MODEL TUTORIAL 10.

XP New Perspectives on XML, 2 nd Edition Tutorial 10 1 WORKING WITH THE DOCUMENT OBJECT MODEL TUTORIAL 10.
Ajax Technology for the Web Nic Shulver, FCET, Staffordshire University Introduction What is it? Pros and Cons Why is it important? Traditional Client-Server.

Ajax Technology for the Web Nic Shulver, FCET, Staffordshire University Introduction What is it? Pros and Cons Why is it important? Traditional Client-Server.

Similar presentations

Ads by Google