DEV Community

Cover image for The Piece Table - the Unsung Hero of Your Text Editor

The Piece Table - the Unsung Hero of Your Text Editor

Darren Burns on January 24, 2019

The piece table is the unsung hero data-structure that is responsible for much of the functionality and performance characteristics we’ve come to e...
Collapse
 
isaacdlyman profile image
Isaac Lyman

This is a great article. It reminds me a little of the "Delta" structure used by QuillJS. The document itself is represented as an array of objects, but updates are represented atomically as new objects of type retain, insert, or delete. I don't think it offers the same performance advantages as a true piece table, but it does provide some flexibility about how you build the document and respond to changes.

Collapse
 
_darrenburns profile image
Darren Burns

Thanks Isaac :)

Collapse
 
daveskull81 profile image
dAVE Inden

Great post. I had never heard of this data structure until now. It makes a lot of sense how it could be implemented to build a text editor and would be much more performant than storing things in an array. It is also great to see the kinds of things used to build the tools many use to build tools that many others will use. Thanks for writing this!

Collapse
 
_darrenburns profile image
Darren Burns

Thanks very much!

Collapse
 
sriharsha32 profile image
SriHarsha Sreenath

Very well written article. Thanks for introducing us to a new data structure.

Collapse
 
_darrenburns profile image
Darren Burns

Thanks 🙂

Collapse
 
adambrandizzi profile image
Adam Brandizzi

Wow, this data structure is amazing! And the post does justice to it, well written and clear. Thank you for that, Darren!

Collapse
 
_darrenburns profile image
Darren Burns

Thanks so much, Adam, I really appreciate the feedback!

Collapse
 
aligear profile image
aligear

Thanks for the enlightenment! Great article which gives you where to start looking to understand how text editors works internally.

Collapse
 
_darrenburns profile image
Darren Burns

Thank you so much! Really appreciate your feedback 🙂

Collapse
 
qm3ster profile image
Mihail Malo

Very accessible writeup, thank you, I was able to share this with many people.
Could you maybe make a follow up comparing and contrasting the Piece Table with the Rope data structure for text editing?

Collapse
 
_darrenburns profile image
Darren Burns

I'm really happy to hear you found it accessible, that was my main goal :)

Unfortunately, I've never studied or implemented a rope in the past so it would be difficult to give an informed view of how they compare. If I ever take the time to learn about ropes, I'll probably end up writing about them, though!

Thanks for sharing the post too.

Collapse
 
rhymes profile image
rhymes

Thank you very much! I didn't know about it!

Collapse
 
_darrenburns profile image
Darren Burns

Thank you!

Collapse
 
wanaphar profile image
PharWana

Sir. do you have any idea of quilljs