future of web applications real-time collaboration and the · peta hoyes tag1 consulting chief...

83
Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration and the Future of Web Applications

Upload: others

Post on 05-Oct-2020

6 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Peta HoyesTag1 Consulting

Chief Operating Officer

Fabian FranzTag1 ConsultingVP Software Engineering

Real-Time Collaboration and the Future of Web Applications

Page 2: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Tag1 ConsultingThe Team Global Leaders Trust to Ensure Their Success with Technology

➔➔

➔➔

Page 3: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What We’ll Cover

Page 4: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Collaborative Applications

Page 5: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Collaboration is Fundamental

Working Together is How People & Orgs Get Most Things Done

Page 6: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

An Ecosystem of Needs and Tools

Email

Chat

Forums

Wiki

Project Management

Time Tracking

CalendaringFile Sharing

Content Creation

CRM

Knowledge Sharing

Version Control

Conferencing

ToDo Lists

Bug TrackingOnline Training

Page 7: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

The Collaboration SpectrumSynchronous vs. Asynchronous Collaboration

Page 8: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

The Next EpisodeShifting The Paradigm from Single User to Multi User Collaborative Apps

Page 9: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Synchronous Collaboration & The CMS

Content Management Systems Aren’t Awesome For Creating Content

Page 10: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Requirements for Efficient

Collaboration

Page 11: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Presence Awareness (PA) Indicators

Distributed Collaboration Requires Timely Insight Into Availability & Status

Page 12: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Change Management

Editorial Workflow Facilitates The Collaborative Content Creation Process

Page 13: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Algorithms

It’s Complex & Requires Substantial Investment

Page 14: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

The YjsReal-Time

Collaboration Framework

Page 15: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Yjs

A Framework That Enables Collaboration in Any Application

Page 17: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

How does that all even work?

Some theory to empower you!

Page 18: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What the heck is a CRDT?Hint: It's a conflict-free replicated data type

Page 19: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What is a CRDT?

I don't know what Conflict Free Replicated Data type means :(

Page 20: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What is a CRDT?

New York, New York!

Page 21: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Why 271 Bleecker St., New York?

Page 22: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Apparently they have the best neapolitan Pizza! :D

(or so I heard)

Page 23: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What is a CRDT?

TODO LIST

Less Pizza, more code ...

Page 24: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

How can you use a CRDT?

TODO LIST

Todo Lists are the new Hello World!

Page 25: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

How can you use a CRDT?

TODO LIST

Todo Lists are the new Hello World!

Page 26: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

How can you use a CRDT?

And Rich Text?

Page 27: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Challenges for collaborative text

editorsOne tech to solve them all

Page 28: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Personal Undo/Redo

➔ Future idea

Undo alllllll the things ...

Page 29: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Personal Undo/Redo

Undo alllllll the things ...

Page 30: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Perfect conflict resolution is not needed

Page 31: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Personal Undo/Redo

Perfect conflict resolution is not needed!

Page 32: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Personal Undo/Redo

Testing the big players against Yjs!

Page 33: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Personal Undo/Redo

Testing the big players against Yjs!

Page 34: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Personal Undo/RedoTesting the big players against Yjs!

Page 35: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What about offline mode?

Airplanes in the Skyyyy!

Page 36: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What about offline mode?

➔ Future of that:

Robots vs. Humans

Page 37: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Editors, Workflows, Revisions and more

Implementing Collaboration

in Drupal

Page 38: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

How did we implement all this?

Editor selection

Page 39: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

How did we implement all this?

Editor selection

Page 40: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Editor integration

The largest challenge at first

Page 41: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Editor integration

The largest challenge at first

Page 42: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Editor integration

The largest challenge at first

Page 43: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Editor integration

Modern vs Legacy - Two worlds clash

Page 44: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Editor integration

Field Formatters save the day!

Page 45: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

YEAH!

Page 46: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What about Full HTML?

Page 47: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What about Full HTML?

A schema clashes with full html support

Page 48: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What about Full HTML?

A schema clashes with full html support

Page 49: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Biggest Challenge

Page 50: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Non Technical

Page 51: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

How do many users work in a system

designed for a single user?

Page 52: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Revisions + Content workflow + Track changes

Page 53: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Revisions + Track changes

A technical solution

Page 54: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Revisions + Track changes

➔ explicit

A technical solution

Page 55: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Revisions + Track changes

A technical solution

Page 56: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

More challenges

Page 57: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Authentication + Access control

Only they - who haveth the hash - can access the document!

A technical solution

Page 58: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Authentication + Access controlSo many more possibilities ...

Page 59: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Speaking of comments

Page 60: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Implementing comments

Construction in New York - again!

Page 61: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

How does the infrastructure needed

look like?

Page 62: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Infrastructure

What do you need to implement this?

Page 63: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Wordpress is ahead in the race

➔ Wordpress Gutenberg demo already looks really impressive

At least: right now

Page 64: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Let's take a look!

Implementing CollaborationIn WordPress

Page 66: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Gutenberg Prototype in < 24 hours!

Kevin rocks!

Page 67: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Open Source is eating the world

Pizza anyone?

Page 68: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Wordpress has collab on the roadmap!

It's a first class citizen

Page 69: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Wordpress has collab on the road-map!

It's a first class citizen

Page 70: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Peer2Peer is hard

Many commercial VoIP systems still use relay servers

Page 71: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

But: We will hopefully be working on it :)

Page 72: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Imagine the possibilities!

Collaboration & The Future of Applications

Page 73: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Every Application Will Offer Collaboration

The Shift Towards Multi User Collaborative Applications is Happening Now

Page 74: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

CMS Collaboration Goes Beyond Text

Collaboration Will Permeate Content Management Systems

Page 75: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

What about Drupal specifically?

Page 76: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Imagine the possibilities

Real-time collaboration everywhere

Page 77: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Imagine the possibilities

Real-time collaboration everywhere

Page 78: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Imagine the possibilities

Real-time collaboration everywhere

Page 79: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Let's make the future of web applications happen!

Page 80: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

It has already started!

Page 81: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Questions? [email protected]

Q&A

Page 82: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration

Want to Learn More? Tag1.com/YjsYjs Real-Time Collaboration Framework Documentation & Resources

Page 83: Future of Web Applications Real-Time Collaboration and the · Peta Hoyes Tag1 Consulting Chief Operating Officer Fabian Franz Tag1 Consulting VP Software Engineering Real-Time Collaboration