SlideShare a Scribd company logo
1 of 15
Download to read offline
Miroslav Cupák, Hao Yan
Undo, Redo and Collaboration
in Web Applications
Dec 10, 2012
Introduction
● idea: investigate the use of application-level
undo-redo to achieve collaboration
● motivation - collaboration is a crucial feature
○ Google Docs, Zoho Writer, SubEthaEdit...
○ essential for web-based word processing and
spreadsheet
● goal: enable collaboration for a web-based
diagram drawing software
Background
● Brown, Patterson: Undo for operators: building an
undoable e-mail store.
● Lowell, Chandra, Chen: Exploring failure transparency
and the limits of generic recovery.
● Edwards, Mynatt: Timewarp: techniques for
autonomous collaboration.
● Michael, Towndrow, Wiz: Conditions for successful
online document collaboration.
Asciiflow
Asciiflow
● web application primarily used for diagrams
● based on Java + Google Web Toolkit
○ client-server model with RPC communication
● 20+ operations
● local physical undo and redo
○ maintains a set of pixel-based changes on the client
● no collaboration support
○ local save overwriting external changes
Goals
● allow multiple users to co-author a diagram
smoothly
● changes merged and propagated to all the
users
● each user is able to perform local undo and
redo his own actions
● graceful resolution of conflicts without loss of
data
Implementation
● modify RPC communication and persistence
● change model to enable state sharing
○ track the user issuing changes
○ extend information sent to the server
● add autosave capabilities
○ synchronize save after each operation
● adapt the concept to pixel-based operations
● enable manual undo-redo of local operations
Implementation
● load and save coordination on the server
○ check the owner of the snapshot before saving
○ if owner = current user, proceed with simple save
○ otherwise merge changes before saving
● merging of changes
○ undo local operations
○ load the foreign snapshot
○ redo local operations on the new snapshot
○ save the new state
Conflicts
● save merging might lead to conflicts
○ eg. two players draw two overlapping shapes
simultaneously
● most modifications of the same region OK
○ the slightly late change will be applied on top of the
earlier change
● conflicts become a problem when undo
operation is involved
Inconsistent result
Resolving Conflicts
● all conflicts are associated with undo / redo
actions
○ without knowledge of actions of other users, local
physical undo / redo always cause consistency
problems
● need to save a global log of user actions on
server to fundamentally prevent conflicts
from happening
Resolving Conflicts
● global action log stored as part of the state
on server
A
B
.
.
.
undo redo
undo redo
TimeGlobal Log of User Actions
Local Undo A Local Redo B
Evaluation
● performance overheads of the collaboration
features compared to the original application
(merge cost, amount of data being sent)
Conclusions
● successful implementation of features that
allow collaboration for Asciiflow
● demonstration of application-level undo-redo
to achieve collaboration
● may improve performance by sending only
the updates to server
Questions?

More Related Content

Similar to Undo, Redo and Collaboration in Web Applications

Oracle ADF Task Flows for Beginners
Oracle ADF Task Flows for BeginnersOracle ADF Task Flows for Beginners
Oracle ADF Task Flows for Beginners
DataNext Solutions
 

Similar to Undo, Redo and Collaboration in Web Applications (20)

AngularJS in Production (CTO Forum)
AngularJS in Production (CTO Forum)AngularJS in Production (CTO Forum)
AngularJS in Production (CTO Forum)
 
Introduction to react native
Introduction to react nativeIntroduction to react native
Introduction to react native
 
Bootstrapping a ML platform at Bluevine [Airflow Summit 2020]
Bootstrapping a ML platform at Bluevine [Airflow Summit 2020]Bootstrapping a ML platform at Bluevine [Airflow Summit 2020]
Bootstrapping a ML platform at Bluevine [Airflow Summit 2020]
 
Mobilesoft presentation
Mobilesoft presentationMobilesoft presentation
Mobilesoft presentation
 
One year solving infrastructure management with FusionDirectory and OpenLDAP,...
One year solving infrastructure management with FusionDirectory and OpenLDAP,...One year solving infrastructure management with FusionDirectory and OpenLDAP,...
One year solving infrastructure management with FusionDirectory and OpenLDAP,...
 
React for non techies
React for non techiesReact for non techies
React for non techies
 
React for Non Techies
React for Non TechiesReact for Non Techies
React for Non Techies
 
React for non techies
React for non techiesReact for non techies
React for non techies
 
Airflow Intro-1.pdf
Airflow Intro-1.pdfAirflow Intro-1.pdf
Airflow Intro-1.pdf
 
Effects, Coeffects & Subscriptions: a pit of success for SPAs
Effects, Coeffects & Subscriptions: a pit of success for SPAsEffects, Coeffects & Subscriptions: a pit of success for SPAs
Effects, Coeffects & Subscriptions: a pit of success for SPAs
 
Lighthouse
LighthouseLighthouse
Lighthouse
 
Cloud computing and software engineering
Cloud computing and software engineeringCloud computing and software engineering
Cloud computing and software engineering
 
Rapid Application Development with MEAN Stack
Rapid Application Development with MEAN StackRapid Application Development with MEAN Stack
Rapid Application Development with MEAN Stack
 
ADF Taskflows for beginners
ADF Taskflows for beginnersADF Taskflows for beginners
ADF Taskflows for beginners
 
[Dec 1 meetup] upgrading microservices
[Dec 1 meetup] upgrading microservices[Dec 1 meetup] upgrading microservices
[Dec 1 meetup] upgrading microservices
 
Why Concurrency is hard ?
Why Concurrency is hard ?Why Concurrency is hard ?
Why Concurrency is hard ?
 
Oracle ADF Task Flows for Beginners
Oracle ADF Task Flows for BeginnersOracle ADF Task Flows for Beginners
Oracle ADF Task Flows for Beginners
 
Snowflake Automated Deployments / CI/CD Pipelines
Snowflake Automated Deployments / CI/CD PipelinesSnowflake Automated Deployments / CI/CD Pipelines
Snowflake Automated Deployments / CI/CD Pipelines
 
Concurrency - Why it's hard ?
Concurrency - Why it's hard ?Concurrency - Why it's hard ?
Concurrency - Why it's hard ?
 
React js Rahil Memon
React js Rahil MemonReact js Rahil Memon
React js Rahil Memon
 

More from Miro Cupak

More from Miro Cupak (20)

Exploring the latest and greatest from Java 14
Exploring the latest and greatest from Java 14Exploring the latest and greatest from Java 14
Exploring the latest and greatest from Java 14
 
Exploring reactive programming in Java
Exploring reactive programming in JavaExploring reactive programming in Java
Exploring reactive programming in Java
 
Exploring the last year of Java
Exploring the last year of JavaExploring the last year of Java
Exploring the last year of Java
 
Local variable type inference - Will it compile?
Local variable type inference - Will it compile?Local variable type inference - Will it compile?
Local variable type inference - Will it compile?
 
The Good, the Bad and the Ugly of Java API design
The Good, the Bad and the Ugly of Java API designThe Good, the Bad and the Ugly of Java API design
The Good, the Bad and the Ugly of Java API design
 
Local variable type inference - Will it compile?
Local variable type inference - Will it compile?Local variable type inference - Will it compile?
Local variable type inference - Will it compile?
 
Exploring reactive programming in Java
Exploring reactive programming in JavaExploring reactive programming in Java
Exploring reactive programming in Java
 
The good, the bad, and the ugly of Java API design
The good, the bad, and the ugly of Java API designThe good, the bad, and the ugly of Java API design
The good, the bad, and the ugly of Java API design
 
Master class in modern Java
Master class in modern JavaMaster class in modern Java
Master class in modern Java
 
The good, the bad, and the ugly of Java API design
The good, the bad, and the ugly of Java API designThe good, the bad, and the ugly of Java API design
The good, the bad, and the ugly of Java API design
 
Exploring reactive programming in Java
Exploring reactive programming in JavaExploring reactive programming in Java
Exploring reactive programming in Java
 
The good, the bad, and the ugly of Java API design
The good, the bad, and the ugly of Java API designThe good, the bad, and the ugly of Java API design
The good, the bad, and the ugly of Java API design
 
Writing clean code with modern Java
Writing clean code with modern JavaWriting clean code with modern Java
Writing clean code with modern Java
 
The good, the bad, and the ugly of Java API design
The good, the bad, and the ugly of Java API designThe good, the bad, and the ugly of Java API design
The good, the bad, and the ugly of Java API design
 
Master class in modern Java
Master class in modern JavaMaster class in modern Java
Master class in modern Java
 
Exploring reactive programming in Java
Exploring reactive programming in JavaExploring reactive programming in Java
Exploring reactive programming in Java
 
Writing clean code with modern Java
Writing clean code with modern JavaWriting clean code with modern Java
Writing clean code with modern Java
 
Exploring what's new in Java 10 and 11 (and 12)
Exploring what's new in Java 10 and 11 (and 12)Exploring what's new in Java 10 and 11 (and 12)
Exploring what's new in Java 10 and 11 (and 12)
 
Exploring what's new in Java 10 and 11
Exploring what's new in Java 10 and 11Exploring what's new in Java 10 and 11
Exploring what's new in Java 10 and 11
 
Exploring what's new in Java in 2018
Exploring what's new in Java in 2018Exploring what's new in Java in 2018
Exploring what's new in Java in 2018
 

Recently uploaded

Large-scale Logging Made Easy: Meetup at Deutsche Bank 2024
Large-scale Logging Made Easy: Meetup at Deutsche Bank 2024Large-scale Logging Made Easy: Meetup at Deutsche Bank 2024
Large-scale Logging Made Easy: Meetup at Deutsche Bank 2024
VictoriaMetrics
 
Abortion Pill Prices Tembisa [(+27832195400*)] 🏥 Women's Abortion Clinic in T...
Abortion Pill Prices Tembisa [(+27832195400*)] 🏥 Women's Abortion Clinic in T...Abortion Pill Prices Tembisa [(+27832195400*)] 🏥 Women's Abortion Clinic in T...
Abortion Pill Prices Tembisa [(+27832195400*)] 🏥 Women's Abortion Clinic in T...
Medical / Health Care (+971588192166) Mifepristone and Misoprostol tablets 200mg
 

Recently uploaded (20)

WSO2CON 2024 - Does Open Source Still Matter?
WSO2CON 2024 - Does Open Source Still Matter?WSO2CON 2024 - Does Open Source Still Matter?
WSO2CON 2024 - Does Open Source Still Matter?
 
Large-scale Logging Made Easy: Meetup at Deutsche Bank 2024
Large-scale Logging Made Easy: Meetup at Deutsche Bank 2024Large-scale Logging Made Easy: Meetup at Deutsche Bank 2024
Large-scale Logging Made Easy: Meetup at Deutsche Bank 2024
 
OpenChain - The Ramifications of ISO/IEC 5230 and ISO/IEC 18974 for Legal Pro...
OpenChain - The Ramifications of ISO/IEC 5230 and ISO/IEC 18974 for Legal Pro...OpenChain - The Ramifications of ISO/IEC 5230 and ISO/IEC 18974 for Legal Pro...
OpenChain - The Ramifications of ISO/IEC 5230 and ISO/IEC 18974 for Legal Pro...
 
WSO2CON 2024 - OSU & WSO2: A Decade Journey in Integration & Innovation
WSO2CON 2024 - OSU & WSO2: A Decade Journey in Integration & InnovationWSO2CON 2024 - OSU & WSO2: A Decade Journey in Integration & Innovation
WSO2CON 2024 - OSU & WSO2: A Decade Journey in Integration & Innovation
 
Devoxx UK 2024 - Going serverless with Quarkus, GraalVM native images and AWS...
Devoxx UK 2024 - Going serverless with Quarkus, GraalVM native images and AWS...Devoxx UK 2024 - Going serverless with Quarkus, GraalVM native images and AWS...
Devoxx UK 2024 - Going serverless with Quarkus, GraalVM native images and AWS...
 
Artyushina_Guest lecture_YorkU CS May 2024.pptx
Artyushina_Guest lecture_YorkU CS May 2024.pptxArtyushina_Guest lecture_YorkU CS May 2024.pptx
Artyushina_Guest lecture_YorkU CS May 2024.pptx
 
WSO2CON 2024 - Cloud Native Middleware: Domain-Driven Design, Cell-Based Arch...
WSO2CON 2024 - Cloud Native Middleware: Domain-Driven Design, Cell-Based Arch...WSO2CON 2024 - Cloud Native Middleware: Domain-Driven Design, Cell-Based Arch...
WSO2CON 2024 - Cloud Native Middleware: Domain-Driven Design, Cell-Based Arch...
 
WSO2CON 2024 - How to Run a Security Program
WSO2CON 2024 - How to Run a Security ProgramWSO2CON 2024 - How to Run a Security Program
WSO2CON 2024 - How to Run a Security Program
 
WSO2Con2024 - Facilitating Broadband Switching Services for UK Telecoms Provi...
WSO2Con2024 - Facilitating Broadband Switching Services for UK Telecoms Provi...WSO2Con2024 - Facilitating Broadband Switching Services for UK Telecoms Provi...
WSO2Con2024 - Facilitating Broadband Switching Services for UK Telecoms Provi...
 
Abortion Pill Prices Tembisa [(+27832195400*)] 🏥 Women's Abortion Clinic in T...
Abortion Pill Prices Tembisa [(+27832195400*)] 🏥 Women's Abortion Clinic in T...Abortion Pill Prices Tembisa [(+27832195400*)] 🏥 Women's Abortion Clinic in T...
Abortion Pill Prices Tembisa [(+27832195400*)] 🏥 Women's Abortion Clinic in T...
 
%in Stilfontein+277-882-255-28 abortion pills for sale in Stilfontein
%in Stilfontein+277-882-255-28 abortion pills for sale in Stilfontein%in Stilfontein+277-882-255-28 abortion pills for sale in Stilfontein
%in Stilfontein+277-882-255-28 abortion pills for sale in Stilfontein
 
WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation
WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital TransformationWSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation
WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation
 
WSO2Con2024 - Unleashing the Financial Potential of 13 Million People
WSO2Con2024 - Unleashing the Financial Potential of 13 Million PeopleWSO2Con2024 - Unleashing the Financial Potential of 13 Million People
WSO2Con2024 - Unleashing the Financial Potential of 13 Million People
 
WSO2CON 2024 - Software Engineering for Digital Businesses
WSO2CON 2024 - Software Engineering for Digital BusinessesWSO2CON 2024 - Software Engineering for Digital Businesses
WSO2CON 2024 - Software Engineering for Digital Businesses
 
WSO2Con2024 - Enabling Transactional System's Exponential Growth With Simplicity
WSO2Con2024 - Enabling Transactional System's Exponential Growth With SimplicityWSO2Con2024 - Enabling Transactional System's Exponential Growth With Simplicity
WSO2Con2024 - Enabling Transactional System's Exponential Growth With Simplicity
 
WSO2CON 2024 - Freedom First—Unleashing Developer Potential with Open Source
WSO2CON 2024 - Freedom First—Unleashing Developer Potential with Open SourceWSO2CON 2024 - Freedom First—Unleashing Developer Potential with Open Source
WSO2CON 2024 - Freedom First—Unleashing Developer Potential with Open Source
 
Architecture decision records - How not to get lost in the past
Architecture decision records - How not to get lost in the pastArchitecture decision records - How not to get lost in the past
Architecture decision records - How not to get lost in the past
 
WSO2Con2024 - GitOps in Action: Navigating Application Deployment in the Plat...
WSO2Con2024 - GitOps in Action: Navigating Application Deployment in the Plat...WSO2Con2024 - GitOps in Action: Navigating Application Deployment in the Plat...
WSO2Con2024 - GitOps in Action: Navigating Application Deployment in the Plat...
 
WSO2CON 2024 - Building the API First Enterprise – Running an API Program, fr...
WSO2CON 2024 - Building the API First Enterprise – Running an API Program, fr...WSO2CON 2024 - Building the API First Enterprise – Running an API Program, fr...
WSO2CON 2024 - Building the API First Enterprise – Running an API Program, fr...
 
WSO2Con2024 - Simplified Integration: Unveiling the Latest Features in WSO2 L...
WSO2Con2024 - Simplified Integration: Unveiling the Latest Features in WSO2 L...WSO2Con2024 - Simplified Integration: Unveiling the Latest Features in WSO2 L...
WSO2Con2024 - Simplified Integration: Unveiling the Latest Features in WSO2 L...
 

Undo, Redo and Collaboration in Web Applications

  • 1. Miroslav Cupák, Hao Yan Undo, Redo and Collaboration in Web Applications Dec 10, 2012
  • 2. Introduction ● idea: investigate the use of application-level undo-redo to achieve collaboration ● motivation - collaboration is a crucial feature ○ Google Docs, Zoho Writer, SubEthaEdit... ○ essential for web-based word processing and spreadsheet ● goal: enable collaboration for a web-based diagram drawing software
  • 3. Background ● Brown, Patterson: Undo for operators: building an undoable e-mail store. ● Lowell, Chandra, Chen: Exploring failure transparency and the limits of generic recovery. ● Edwards, Mynatt: Timewarp: techniques for autonomous collaboration. ● Michael, Towndrow, Wiz: Conditions for successful online document collaboration.
  • 5. Asciiflow ● web application primarily used for diagrams ● based on Java + Google Web Toolkit ○ client-server model with RPC communication ● 20+ operations ● local physical undo and redo ○ maintains a set of pixel-based changes on the client ● no collaboration support ○ local save overwriting external changes
  • 6. Goals ● allow multiple users to co-author a diagram smoothly ● changes merged and propagated to all the users ● each user is able to perform local undo and redo his own actions ● graceful resolution of conflicts without loss of data
  • 7. Implementation ● modify RPC communication and persistence ● change model to enable state sharing ○ track the user issuing changes ○ extend information sent to the server ● add autosave capabilities ○ synchronize save after each operation ● adapt the concept to pixel-based operations ● enable manual undo-redo of local operations
  • 8. Implementation ● load and save coordination on the server ○ check the owner of the snapshot before saving ○ if owner = current user, proceed with simple save ○ otherwise merge changes before saving ● merging of changes ○ undo local operations ○ load the foreign snapshot ○ redo local operations on the new snapshot ○ save the new state
  • 9. Conflicts ● save merging might lead to conflicts ○ eg. two players draw two overlapping shapes simultaneously ● most modifications of the same region OK ○ the slightly late change will be applied on top of the earlier change ● conflicts become a problem when undo operation is involved
  • 11. Resolving Conflicts ● all conflicts are associated with undo / redo actions ○ without knowledge of actions of other users, local physical undo / redo always cause consistency problems ● need to save a global log of user actions on server to fundamentally prevent conflicts from happening
  • 12. Resolving Conflicts ● global action log stored as part of the state on server A B . . . undo redo undo redo TimeGlobal Log of User Actions Local Undo A Local Redo B
  • 13. Evaluation ● performance overheads of the collaboration features compared to the original application (merge cost, amount of data being sent)
  • 14. Conclusions ● successful implementation of features that allow collaboration for Asciiflow ● demonstration of application-level undo-redo to achieve collaboration ● may improve performance by sending only the updates to server