Skip to content
This repository has been archived by the owner on Apr 19, 2021. It is now read-only.

Console animation v1 #1019

Open
wants to merge 6 commits into
base: rebrand
Choose a base branch
from
Open

Conversation

nsivertsen
Copy link

This is a very rough first sketch of the console animation. The main purpose is for us to sync on workflow and to have an element to place on the home page as a placeholder. It's not exactly efficient, as it kicks off a React rendering pass multiple times a second.

The next version will start to improve some of that.

Just for fun, I've attached the v0 which we did as a custom element. It is even rougher but performs quite a bit better due to not relying on VDOM diffing.

gitpod-animations.zip

We've also been investigating canvas-based approaches for the text rendering. In the end it boils down to the amount of lines that we want to render in the animation, so we'd like to delay that decision until we've sat down and thought about things like timing and duration of the animation.

You said you wanted to use Tailwind for styling, is that still the plan? We went with Emotion for now as the other pages used that, but could easily switch it over.

@nsivertsen
Copy link
Author

I just pushed a version that uses manual DOM manipulation for the animation, bypassing the React renderer. This brings in some complexity, but it also means we're not diffing a large array on every render.

Thoughts?

I also pulled in a few small useful dependencies, but would like to discuss with you whether you're happy with that.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants