JSPM

  • Created
  • Published
  • Downloads 3
  • Score
    100M100P100Q49199F
  • License MIT

The core of the blocky editor

Package Exports

  • blocky-core
  • blocky-core/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (blocky-core) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Blocky Editor

Blocky Editor is an editor which supports the concept of blocks. It can help you to build an editor like Notion. It's tiny, fast and extensible. You can extend it with blocks.

Demo

Features

  • Extremely small.
  • Extensible. Extend the editor with custom blocks and spans.
  • Static typed.
  • Collaborative editing.

Packages

  • Core(npm): The core of the editor. Written in vanilla JS. It can be used standalone without any UI frameworks.
    • Gzipped size: ~32kb
  • Preact(npm): Wrap the editor in Preact. Provide the UI facilities such as toolbar and banner.
  • Example: The example to demonstrate how to use the editor.
    • Gzipped size: ~43kb (one-time loading)

Resources

Compatibility

Tested on

  • Google Chrome
  • Microsoft Edge
  • Safari

FAQ

Why does it use Preact instead of React?

Because it's small. React(used with ReactDOM) costs nearly 47kb after minified and gzipped. And Preact costs 4kb. I want the size of the editor to be as small as possible.

And Preact is closer to the DOM. React has an abstract layer for event handling, which is complicated and useless for the editor.

Actually, you can wrap the editor in React/Vue/Angular. It's easy to do that. I don't have time to do that, and Preact is good enough for me.