mirror of
https://github.com/actualbudget/actual.git
synced 2026-03-10 20:23:07 -05:00
Migrate from Glamor to Emotion #283
No Assignees
Notifications
Due Date
No due date set.
Dependencies
No dependencies set.
Reference: github-starred/actual#283
Reference in New Issue
Block a user
Delete Branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Originally created by @j-f1 on GitHub (Feb 27, 2023).
Glamor was last updated in 2017, and Emotion is a popular and actively maintained alternative that remains largely compatible with Glamor’s APIs.
@albertogasparin commented on GitHub (May 2, 2023):
Might be able to tackle this one sometime in the future (especially because glamor types are basically
any🤦 ), but first wanna make sure we know what we are getting into. The reason is that with React 18 and some of the work behind SSR/server components/concurrent features a lot of CSS-in-JS solutions out there are currently struggling.[Important: I'm not listing any framework, eg Tailwind, as that is a different conversation]
⚠️ Emotion
Still on R16 and SSR not working properly (see issues), probably due to lack of resources. Thinkmill (main sponsor) is re-prioritising things, another main sponsors left and chakra-ui is also moving away from it. We might not face those challenges, but I think it is still worth mentioning.
⚠️ styled-components
A new version (v6) is in the works, but still beta and unclear whenever performance (currently 20% slower), full R18 support and stable API will come.
⚠️ compiled
Atlassian is investing in it, but there is no real community and official R18 support will come later this year. It is also optimised for large apps, so might not offer the be the best output.
👀 vanilla-extract
Slightly different and with no specific React binding, it has a very nice, type safe theming API (compared to the handmade once we currently have) but it is less known and might cause friction to casual contributors.
👀 linaria
Currently having momentum, but it is very strict on the feature set (eg no dynamic styles).
Ⓜ️ CSS modules
"Old, boring" tech that however still delivers best value in terms of performance and flexibility. Needs to be strongly linted to stop devs from writing bad CSS, and TS support is editor only but it is here to stay.
🔴 stitches
Seems stopped and in maintenance mode, plus current version does not support SSR properly
There are more (new ones being build every other week) but I think I covered the main ones. Outcome: seems like a quite uncertain period. Probably using anything with
cssis fine as we can easily migrate between libraries, but I'd recommend to stick to widely supported features so migration between libs (if necessary) is easier.Also, any particular reason why we would prefer emotion to styled-components? SC is more popular and has better community support.
@j-f1 commented on GitHub (May 2, 2023):
Fortunately Actual is entirely a client rendered app (I don’t see server rendering as something that would make things much better given how the app is set up). Concurrent rendering could be nice but I also don’t think we would have a problem staying away from that if we wanted to.
When I looked at styled-components, it seemed like we would need to change a ton of existing code, while Emotion is inspired by Glamor and therefore has a very similar API. (For example, I don’t think SC supports sub selectors using the object syntax?).
@maxichrome commented on GitHub (May 10, 2023):
Just passing by on my way through an entirely unrelated issue on an unrelated project, to shed some light on this specific bit:
I edited the Style Objects example on styled-components' example to contain a child and it seems to work just fine:
@youngcw commented on GitHub (Oct 18, 2024):
@joel-jeremy Can this be closed now?
@youngcw commented on GitHub (Nov 4, 2024):
completed by #3471