After discovering the idea of "A Meta-Layer for Notes", I started to try reading in this way ↓.

Creating side notes right next to the main content is intuitive, and the reading process automatically builds up an "image" of the connections between the content and the side notes for my mind, helping me recall the context later.

The main content could be anything, from webpages, PDFs, images, to apps. Also there should be some automation tools to do semantic highlighting, screenshot, content extraction, archiving, etc.

Also posted at


If you want to make an all-in-one game-changing app, go make an operating system. Literally, an operating system is all-in-one, with no exceptions. Don't make an app and get trapped by human interface guidelines and APIs that will handcuff you at some point.

Also posted at


Found another quirk of the Chromium browser:

Using transform and opacity (setting to less than 1) together may make text blurry.

This is especially annoying when animating opacity from 0 to 1, since there would be a visual glitch where the text starts blurry and suddenly becomes clear when opacity reaches 1.

BTW, it does not happen on Firefox.

Also posted at


Stumbled across a demo video showing the earliest version of Jade on my computer.

Also posted at


Why setting backdrop-filter: blur(5px) (to make sweet background blur effect) causes "Composite Layers" almost 100x slower? Too bad...

Also posted at


Finally, pushed the code, published an NPM package, and written a post "How to Draw S-Curved Arrows Between Boxes / Rectangles" for the "curved arrow" 🎉

How to Draw S-Curved Arrows Between Boxes / Rectangles

Also posted at


Life only gets harder, problems only get more difficult, but likewise you only grow when you get through the hard things.

Also posted at


Playing more with the "curved arrow" — trying to visualize how it works!

By the way that interactive panel is built with leva in a few minutes. Great work @pmndrs!


One thing I appreciate in Jade is that playing with blocks in a canvas is fun, so I don't find it tedious to rearrange them into better shape.

Also posted at




Learning and thinking statistics in one month

11/23 → 12/23

Canvas: 312 → 371

Block: 4658 → 6000 🎉

I should consider making a line chart, which might reveal more insight.


Some thoughts on duck-typing:

Types are not rigorously defined rules but patterns discovered in accumulating facts.

→ Schema should come after data accumulated and should accommodate exceptions, which may be discovered as new patterns later.


A cool knowledge management framework(?)! Apps working around a universal database sounds like a promising idea to me.

Will read the docs to learn more about it. 👉

This also reminds me of Trilium Notes and @thesephist's suite of personal productivity tools (Build tools around workflows, not workflows around tools, Monocle, a full text search engine, and Revery, a semantic search engine). It would be interesting to take a look at them as well.



New algorithm for drawing an arrow between two rectangles. Jade

Will write a post about the tricks and publish a package to NPM.

Shall I call it "less-perfect-arrows" as opposed to @steveruizok's "perfect-arrows"? Since mine only allows the start point and the end point to be in the middle of an edge. Open to package name suggestions!


Moodboard with custom theme in Jade!


git log --date=format:%Y-%m --pretty=format:"%ad %an" | sort | uniq -c

A command that shows the number of commits in each month, which pushes me to write more code!


As Jade having an append-only database, deleted concepts are not actually deleted but marked deleted. Sometimes it's interesting to see what has become the past, and now there's a way.

Calculating the average lifetime of deleted concepts may be another fun experiment to do.


I discover that, for knowledge to be useful, it has to be reduced/compressed (merge similar ideas and make the usage of words concise) and structured (add order, hierarchy, or network).

Accumulating lots of small ideas makes me feel like being productive, but without regular reviewing and organizing, it leads to a growing mess, where, although there's a large amount of knowledge, I cannot effectively use the knowledge to solve problems or make decisions.

I failed to identify this problem when I was using document-based tools or outliners, like Notion, Obsidian, or Orgzly, since everything always "looks structured" no matter if the content is actually structured. But in Jade , with a canvas, I can easily see what is a mess and what is structured knowledge. The canvas reveals that visually and encourages me to take action.

Another thing I'm still exploring is that structured knowledge in a canvas seems to look unlike a document or nested bullet points. Trying to mimic those representations is awkward.


Fix bugs that can make you crazy. #Jade



Building CSS block to design dark mode.

As a side effect you'll also be able to create your own themes! #Jade

Inspired by's "Write Style Rules"


Released the first seriously written tutorial for Jade .

(If you see the old data, try using an Incognito window.)


Improved the Embed block by allowing resizing height. #Jade

So you can:

  • make an article comfortable to read,
  • remove black bars of YouTube videos that have special aspect ratios.


Designing a new tutorial with block links. #Jade


Greatly improved Search tool and Insight tool[1] this week, to make finding stuff faster. #Jade

[1]: You can think of it as the equivalent of "Backlinks".


Now I have accumulated over 2000 concepts in #Jade and start to feel disoriented. Therefore, I'm looking for answers to these two questions:

  1. How to surface important concepts or concepts that are important to the user?
  2. How to give the user the feeling of mastery of their database?

2021 (Legacy Style)
  • Making Unknown Page — A digital canvas to grow personal knowledge.

  • Reading Books
    • Domain-Driven Design: Tackling Complexity in the Heart of Software by Eric Evans
    • Designing Data-Intensive Applications: The Big Ideas Behind Reliable, Scalable, and Maintainable Systems by Martin Kleppmann

2020 (Legacy Style)
  • Reading Effective JavaScript: 68 Specific Ways to Harness the Power of JavaScript

  • Reading Head First Design Patterns





「你所不知道的 C 語言」系列講座

This is a series of online lectures diving deep into the C programming language.

I planned to study computer architecture and operating systems in the upcoming semester of my EE undergraduate program. In computer architecture and operating systems we need to work with computer hardware details, and C is an abstraction that is the closest to how the computer hardware works, so having enough understanding on C will help me digest the materials of computer architecture and operating systems courses.

Working on the new version of Notablog

This is one of my baby software project that has shown some sign of potential. Currently, the two general directions I'm exploring are to make it more independent of Notion and to find deeper meaning than just being a static site generator.

For the implementation part, things that need to be improved with higher priority are:

  1. Link to other pages in the same Notion table with normal Notion URLs get from "Copy Link".
  2. Better user interface.
  3. Migrate to a better tool for making page templates, refer to experiment 1.
  4. Code refactoring.

Experiments to do are:

  1. Use Svelte to make page templates. (If not ideal, see if squirrelly v8 can include partials without registering in code, otherwise fallback to EJS.)
  2. Turn it into a decentralized blog publishing / subscribing application.
  3. Make a moments page which may looks like this or this.


Reading Paul Graham's Essays

I found some of Paul's perspectives useful. They either help me to think about life or give me directions on decision making.

Learning about Dynamicland, and the Future of Computing

I've always been disappointed about the computers we have today, and I've spent countless hours programming to eradicate constraints I encountered and build what I needed. But improving the computer isn't just about programming, as I learned from the computer history — Vannevar Bush's Memex, Douglas Engelbart's Augmenting Human Intellect, Ted Nelson's Xanadu, Alan Kay's Smalltalk, Apple's Macintosh, Linus Torvalds' Linux, and Bret Victor's talks. The computer is a mix of technology, design, culture, philosophy, and many things. There are a lot to learn, and now I want to focus on the topic of Dynamicland, but as always, there're some other unexpected, randomly found inspiring materials.


Redesign notablog

In fact, I don't want a blog.

I want a place, where I can present any form of art I would like to share with people, and being able to change any part of it dynamically to reflect my real-time emotion and thought.

Furthermore, I want to integrate my knowledge system and the above described presenting place, so that all information I share has single source of truth, i.e. the publicly presented content is a projection of my knowledge system. There will be no more information copying between apps, because every piece of information has only one authority.

In short, the goal is to make publishing more natural and simple, so that everyone can come and play, with little to no extra effort and cost.

2019 (Legacy Style)

Doing a full rewrite of notionapi-agent

See develop branch for latest progress.

The first thing I'm going to do is to document all data structures in Notion API correctly and logically with TypeScript. For a sneak peak, see src/interfaces/notion directory of the project.

Designing a command-line interface for notablog

Still thinking how to improve both user flow and program flow 🤔.

Besides, if you have any idea to share, feel free to email me or open an issue on Github.

Reading books

  • Ted Nelson, Computer Lib/Dream Machines, 1974


Refactoring my Notion-related code projects

Namely notionapi-agent, nast-util-from-notionapi, nast-util-to-html, notablog. The first three are Node.js modules, and the last one is a command-line application. You can find their source code on Github.

As feature patches pile up, the code start to become dirty.

As I dig deeper into Notion's API and come up with more application ideas, the data structure I invented naively become incomplete, and the architecture of the modules become inflexible.

Also, the projects get code quality C on CodeClimate, and I feel unhappy 🙁.

Therefore, I think it's time to refactor them (actually, again).

Just for context : Why I created the projects ?

Notion is a convenient tool to write rich-text documents and build visual databases. Sadly, it's a SaaS product, which means my data stores in the cloud instead of my own computer, and the data can only be accessed through Notion's proprietary API with their web app. Knowing that web services may get shut down, or pricing may change to my disadvantage, or just there're other better apps I'd like to switch to, I want to own my data, in the way I can read, write, transform, and distribute them whenever I want. So, I started the projects.

At the beginning, all my efforts went to 1. designing a data structure that can preserve all information of a Notion page and 2. writing a program to download a Notion page and save it in the format I designed in 1. The result was the birth of notionapi-agent and nast-util-from-notionapi. Then, nast-util-to-html was written to render those downloaded Notion pages to HTML, so I can view them offline or host them on a server.

More later, using above three modules as foundation, notablog made its debut. It is a static site generator, responsible for transforming articles written on Notion into this site you are viewing now.

Learning time management

Primarily David Allen's Getting Things Done® method.


I'm an university student, so this is what I inevitably have to do every day. For details, I'm interested in data structure and algorithm, while having a hard time understanding differential equations.


Idea for this page is inspired by

Last updated @2022/01/11