squint 2025-10-24

https://squint-cljs.github.io/squint/?src=gzip%3AH4sIAAAAAAAAE41WS2%2FjNhC%2B51dMtGhBHay2VxmpWwQ5FChy2b0JRkGLY5sNTWrJkRwjyH8vSOpBye4m9sGWZr55fjMk0w5OXOr87o4J3IMjTgiMkznBW1mbVhNa%2BBVKdzRnINvie97ramglVNs7gKoUsrsD%2F2fXEhkNb6XRq1rJ%2BgW%2BMHfmzX1vuW2E%2F4nmtKH83eMg%2B3o05w1kwKLkj6Cde%2BPAzkfUC0EARb%2FwVjq6KAzhKmOhPFhE%2FR4Ne6XGIrDGrhzZmeEglLppCd7KjqsWgfXPMzfTx2cVFeZZcedMDT2WrX6Hn6Akbg9IEA3n%2Bfvk8rM1GqovdZ0P2UD2GBAnvM8Gi0zuGXaoN8ACZJlFPuVRlQ1kTx1qCBqTjaFOy2JmFkU21tL7fzYE3tt9ts39dyBDbZETrrQRCNVR1nXbeOOsNloEODMWmJZqA1E6RcUcWakPNwS6Pe3Q3hDsjFHI9SiJIvav%2B0WYuj2hpiIG9A1f6dnH5J1M2lG9w5rMwjxTSFBVxA%2FwM9RHqYRFve1VEkJUnMi6RIPJPbATbzbA9tI6GkX5FY%2Fmn2qpD8xi%2Brz9AK%2BlmuJIna3XcORaKIR9q2uSRnMFtTk1RqMml2iGtoUM9noDxA83YmZpixlvGnXxmgEWivHjMJfGjHYwr%2BEHdZp%2FpureCvWaCE8K%2FVPIbazoeg0OKYQhdy3hkAITxuF3qKoX6LYxyqkJkSEveFlpfkJ4Sdsz0X188wBZrbhzGQyQHJhDugdWrILk2ZvxVc2hy6%2FAYSBn4JFo3acqNk%2Bm%2B4BNI4r7yrBiFRdCDO8Fuo%2FY3KOHBAO6qJ3zgzgmeZXltAuTPAsuhF9W9Ld0hBptpGkZFa9LNa3nTxiJigsjJSqHwAqH9OfAiag%2FtjvskS7PJ96t18CbBrUYOQkW69Y62aG6LBgVVKZpnUhVRBuPQR5HLJ23gJh8hkLGLRZijquLjtacvat5i%2Fw0%2BHEzCgu01q91qTuupOjXWpldbdgR%2BOQBRUw7%2B2sOgxEX69EfBY6fYtQbqDjswjHw4Mng3wWy83z2uEvAR%2B5We1O3bgMVqh6LyuvzmmQ3DnIy4gm84VQfoWq49Toaz6u01nF0jRLj2zCE%2Fr8%2FJBxEXL8fwqBpQw%2FDwZoC8%2BFl6mPsD4uGCouN4jU%2B9vIibs0b0eXLzWM8DfC8DaPeQTyqZhHM8QmVFjuIcS2gNwcsaU7%2FbjaNS%2FL0t6%2BkK0aJ5QoYpz3eorzG9BQ85LeMhtL%2BNjDh26WJ0CvroWn0GrYR4Ss9Gk19%2FW6cjWMwqWoIiV7pfyKZccCbXYYQaeULxnx7rgH53PKwSNL%2BJ22PeaYzY42heJsO96T0%2FPreor18RRUZkH3hTZP1dxVhyPzosMuE7LKRWqEwKykgm0wszsqdEZeisehXUR%2FeksPAfKw5sFYm4aMWaPsEQr9CQlF1rMv1WgtG%2BmmLNY6F8MJt9M%2BFWJ2DKF6PyzI68572Gqp%2FIHy3%2Ftbk30dU%2F%2F8%2F6TJkFeAMAAA%3D I bet it won't work for most UIs but simple crud apps, probably good enough.

๐Ÿ˜ 1
๐Ÿ˜ฎ 1

Did you make it with your own brain though @borkdude ๐ŸงŸ๐ŸงŸโ€โ™€๏ธ๐ŸงŸโ€โ™‚๏ธ???? ๐Ÿ˜ฌ

@raymcdermott I asked some ideas to ChatGPT, but I take responsibility for all code written ;)

๐Ÿ‘ฎ๐Ÿปโ€โ™‚๏ธ

You may proceed ๐Ÿ˜…

๐Ÿ˜‚ 1
๐Ÿ˜… 1

Joking aside, the blog you wrote shows your thinking and itโ€™s all explicable. You lack features by comparison to other implementations

I bet it didnโ€™t take too long to produce the first version

Lacking features is solvable when you start with a tiny base

And maybe the bloat comes from what should really be another lib

lacking features is by design. this is just to show "how it works". I'd use this for my blog for example, 3.5kb is nothing. Enterprise apps may have performance issues with this

e.g. I measured a table of 10k items and shuffling the items takes 500ms. but not all enterprise apps may have tables with 10k elements

and react uses :key for this which is pretty easy to implement probably

if you want to see the table slowness in action, https://squint-cljs.github.io/squint/?src=gzip%3AH4sIAAAAAAAAE9VYzXLbNhC%2B%2Byk2zIVsSlt2xpmGbpO2OfXQS5KbRpOBiKWIGAQYAJSsetSX6LXv0XsfpU%2FSWQCkSEl23GOVmQwJYH%2Fw7bc%2FdKosWGfQ2twgW7FGnAGkhcEvnTAI86R2rrXFxQXa5tzWF%2FHQj7Pz2fnrBApmIS4tsuzsLOVYKTBM8TOA5D26zigLzK%2FoBiqpmRNqBa0WyoHqmiUaWKLbICqYQSpUKTsr1phB0KGAVLJOOrjMIMW7fv88IUfnC0hJN1xmmX9XC0i%2FgfRX5uqLYDQDlZFrNzdgHXNYgGRmheDYUiLoCozeWO942IeUOd3AfUHrMF9AofDO5YLDJRSmU4r8r5i0CIVQDs2aSdpVQu6mEOSKNQjzBTkm0cG8rJmxkLBlybFa1eLzrWyUbr8Y67r15m77W0JnAVLWtnJLcYHUYIvMIZdbSF%2FAy3DdnNB7lWXwPFWuhqB3v5OWulMuLGfh1%2FvV3OZGb2AuOJm6LwQHQThD4Z1NB78zv2hLbXCk%2BXI2m4WdSrIVpJrzt6PtqyzbDaYY52TLPoO58hjYDWufBZD9Nf0vrRTM74tb3FqYe8gj3AtPLrtb7M%2F2OCrceM2QNqztr0RerLCXJrD6R4r%2FRAtAmr8BO10KwFurSwihT4VyGqJLwaAn2aFM13KizUCTF95gNuWCbvJw7lkgxM0NhYccjqlRopQWRH86sPLJoJ0GS1SQYtO67VuvLju%2BcsBTHHPnodvSz6NNvPPYiAdORcxIoeL5Gzp8%2BuD%2B50yHQwwi9V5AGh%2BN3mQjR69nGeRX1w85Obrj90Eqg9n5VTboP%2BT7f9JDtaiPu88Epd0RyWDPKNtzKrymayxjSEQP1EGi2rqrKol9Bh0mEPTWg1rig7GLoDiNshCzf%2BAhtpKVmOMazTbXrkaTo8QGlctvheJ7an6shQWnVyuJVL2TRnNMYFOLsoZKmxItcFFVaFA5iCrA1qxFC6njsKb9dUZnA7G%2FDXqtBlcjtMyVNRpoOut6r0BpjhYMI7fA1UzBZ9r2WUIl1%2BGdewyEg%2BwwdpoLaywn0aHSkQvF8Q75QW0gcQHmKJohn9ao3p4kfYytgcIjAcVS6vI2o3tvhJRgUHE0wAhRLtZPUOBbVJadUhG6l8d2qugg5qVEZh4k0bjcTTrdiIeOGZdXzLpcat32WjY1qlxpR7NC7Ik%2Fep0BmFhXOKSf7YVF90tslAeX9lAfZ83NDTRMbaHpHHNCKwstcUKUt0dHU66daNDC%2FBNczuI0sC%2B2J7Lau35UFCbp9iSp2TXVkqHHnSpEhyu%2Bey7oer%2B%2FmjV94E5GJGLqK%2BJkzBB8UiWcbo%2BD48Hv28NIeLGLQYpjRmsUFKQCRodiAP19R8u9s5%2FthedUH9Fj0cdvdHpyyvoR7Z1uWq2onLiauUh4ypjx0EYDH5NW97WISkceciZWEypIti97epOvBW5GkHDw1T%2F0FV%2B%2FvfTC90%2Bf5j%2FAJInPIi3HOex3cmFrMmrQogpshfSoRJKD4LYt2qBpXnCxPqfu6F0CwSkOW4lwX3BhW8m2kFQS7xIoVqyF5LuWHlvGOWGYvPKvS204mnypHQ2syWV7B1ZLweE5Iia7XYhGsEWpSPOk4H2XCuseB%2Fpvshp7Lwn4x6lMGP1EFZBL%2FvnzjwSSv%2F9KssVij9Oqk8yEeFGG5FLcItSiLLt2CkEulBQKH0NiZQQnJIzgH7FpJXP4TsuuURaS61l7B5eVgdf08HL2PwFqn8JLscoDrU8kr6%2FMMXUOsteb6K215EVrcv%2FJwIVPuXA4VPds6liplTNaWrgfwG6YWQn1cw%2FRlQfuQS72mMG8WHbOaQX3hVZ5KUV5C89HZfFyNst2kPzEOT36mSdZPF12LPwE6UkV30HyIbw%2FKvPVqWgHyUc%2FCsUJ51Fto367g%2BQdvQ3niQkxlkNjOHmLaVGne1CNphWglWTxFfFpx%2FbyzLixgp4ONJN1TcPMdsLqsPQgOyYM8ORP3uuNLSCZfj7sjYTqTbRjQqEZGwvc35uqUaxqB8mr2bpOoNBrNJXUG0hY5%2FSQzJMs5pwfJv3g3r5oh0l5jaXTJtdVXvatxg59y3%2FxDZVpOkGGj82hmcQbLmLfCjaGQdsbDPkc%2FzxyERepgXJddsSv8y8dmu0HlN4nSJ6ztk0ymA8lIZQJyogNjcyxoxZFr4vGp0%2Fg%2F9Ho41eHP3YgctgIV4PVDcZvNSWcYFJuz0ZpdkWf9L3wv44wro4QEgAA

Getting anything 100% on point is gonna be a pain but I love the scrappy fiddle!

And from what you say, thereโ€™s a simple solution. My thinking is that enterprise apps are late adopters, unless theyโ€™re apps youโ€™re writing ๐Ÿ˜…

I'm just excited that my scrappy fiddle "reagent" can run my scrappy reagent fiddles from a decade back without any problems :)

๐Ÿ‘Œ๐Ÿผ 1

I did discover one more edge case. event handlers should be removed + inserted when the node changes event handlers. e.g. this:

(if ...
  [:button {:on-click something}]
  [:button {:on-click other}])
which is fixed in 0.0.9

I wonder how eucalypt solves the problem of not having to remount node in case of a click handler

it doesn't seem eucalypt is any faster with this big table shuffling (even a bit slower it seems) https://squint-cljs.github.io/squint/?src=gzip%3AH4sIAAAAAAAAE9VYzXLbNhC%2B%2Byk2zIVsSkt2xpmUbpM0mR5y6CXNTaPpQMRShA0CCABKVj3qS%2FTa9%2Bi9j9In6SxASqQkO%2B6xOnhIAPuDb7%2F9oVPlgGOjzwDSwuKXVlg8A4BZUntvXDGZlFyd3ziOUqzsuUI%2FUaaZYFsyuTH%2B3fR8ev568gJdk0DBHNh5lp2dpRwrBZYpfgaQfELfWuWAhRXdQCU180ItwWihPKi2WaCFBfo1ooIppEKVsnVihRlEHQpIJWulh4sMUrzr988T8nw2h5R0w0WWhXc1h%2FQbSH9mvp5EoxmojFy7vgbnmccCJLNLBM8WEkFXYPXaBcfjPqR2wrxu4L6gHZjNoVB453PB4QIK2ypFN6iYdAiFUB7tiknaVUJuxyDkijUIszm5JtHDrKyZdZCwRcmxWtbi5lY2Spsv1vl2tb7b%2FJbQWYCUGSM34LyF1KJB5pHLDaQv4GW8cE74vcoyeJ4qX0PUu99JS90qH5ez%2BOv9am5zq9cwE5xM3ReCgyCkoQjOpju%2Fs7DoSm1xoPliOp3GnUqyJaSa87eD7css2%2B5MMc7JlnsGMxUwcGtmnkWYwzXDL60UzO6LW9w4mAXIO7jngVhuO9%2Bf7XFUuA6aIW2Y6a9EXiyxlyaw%2BkdiwEgLQJq%2FATdeisA7p0uIoU%2BF8ho6l6LBQLNDmdZwIs6OJi%2BCwWzMBd3k8dyzSIjrawoPOdwlR4lSOhD96cjLJ4N2GixRQYqN8Zu3QV12fOWIpzjmzkO3pV9Am3gXsBEPnOowI4WK52%2Fo8OmD%2B5%2B3Le5i0FHvBaTdo9XrbODo1TSD%2FPLqIScHd%2Fw%2BSmUwPb%2FMdvoP%2Bf6f9FA16uMeMkFpf0Qy2DPK9ZyKr%2BkKyy4kogfqIFFd3VaVxD6DDhMIeutRLfHBunlUnHay0GX%2FjodoJCsxxxXaTa59jTZHiQ0qn98KxffU%2FFwLB14vlxKpfieN5pjAuhZlDZW2JTrgoqrQovLQqQBXM4MOUs9hRfurjM5GYn8b9ToNvkYwzJc1Wmha53uvQGmODiwjt8DXTMENbYcsoZLr8c4%2FBsJBdlg3zoUVlqPoUOnIheJ4h%2FygNpC4AHsUzZhPK1RvT5K%2Bi62FIiABxULq8jaje6%2BFlGBRcbTACFEuVk9QEJpUlp1SEftXwHas6CDmpURmHyTRsNyNOt2Ah55Zn1fM%2BVxqbXot6xpVrrSn8aHrie%2BCzghMV1c4pDdu4tB%2F7BrlwaUD1MdZc30NDVMbaFrPvNDKgSFOiPL26GjKtRcNOpj9ChfTbh7YF9sTWR1cPyoKo3R7ktT0imrJrsedKkSHK6F7zul6v7%2BaNn3gTkakwzRUxNGYIfioSnhtjoMTwO%2Fbw0B4vu2C1I0ZxiooSAUMDnUBDPcdLPfO3rhJ4FQf0WPRx290enLK%2BiHtg26MVlROfM18R3jKmOHYRiMfk073tYhKRx5zpqsmVJBcX%2Fb0Ol8JXA8g4RCqf%2BwroX4H6XnonyHNf4BREp91tBzmcNjJhavJqEWHKrIV0qMSSQ6C3xh0UdOs4GJ1Tt0xuASCUxw2EuG%2B4MIZyTaQVBLvEiiWzEDy2tCjYZwThsmr8LrQlqPNF9rTwJpcmDtwWgoOzxEx2W5jNKItSkWaJwXvu1RcDzjQn9Fq13tJIDyOZeLoJ6qIXPLPn38kkPz9V5LN53uclq1kNsaLMiSX4hahFmXZmjEEuVBSKHwMiaUVnJCwgn%2FGxkjm8YOWbaMcJFdTcwcXlYXv6OHl9H8C1D6FF2KZR1qfSN5QmbvUOcjeYKK3ZsgLY%2FPwycBFSLl4OFb3bOxYqZW3Wjq434HdMLsU6n0P0WUA7kEu9pjBrFi03msF94VWeSlFeQvPB2XxYjrNtpD8yDk9hpknmT9ddij8BOlRFd9C8kt8f1Tmq1PRFpLPYRTqJpxHtQ367RaSD%2FS2O09M6GK5awwnbzEu6nQPqtG0ArSSzL8iPu7YQZ5ZP1TQ04FmsrZpmN2MWB2XHmTHiAGB%2FMknvXYFJOPPh72RWL2JdkwotENjkft7UzWKZe0heTVd1QkUeoW2knoNCWu93iXzKIs554dJv3NvX7TjpLzC0mub6yov%2B1bjdn0rfPHtKtN4gowfm7tm0t1w3vWtaCP%2BnwGRw1r4GpxusPtIUsILJuXmbMDvS%2FqWPkvtpBMGmO2KQSgFN27CddkSFc%2BX6H%2BKrHy%2F%2BcghYcYkWfYvfVpuSMgRAAA%3D

going to try reagent

yeah reagent (on top of react) is faster but also struggling when you get to 10k rows

๐Ÿ’ช๐Ÿผ

I recall there are some specialist React libraries for rendering very large tables (even millions of rows) that do some deeply weird things with the DOM.

An interesting comparison would be with a vanilla JS implementation adding 1000s of rows like that.

js-framework-benchmark or whatever it's called does that. It's pretty straight forward to implement (though a little finicky to set up). With it you can compare to practically anything out there.

๐Ÿ‘€ 1

@chris358 React Virtualized it's called I think, I've used that in the past

BTW if you end up implementing a more complete Reagent clone I will be more than happy to shelve Eucalpyt. It's not something I actually want to build, more like a compulsion I am following because it seems like it should exist. Maybe the test suite could come in handy too.

Looks like an early version of Eucalypt before all those confounded edge cases. ๐Ÿ˜…

๐Ÿ˜† 1

Add some CSS transitions and conditionally move elements around, and you'll find some more cases ๐Ÿ˜…

Need to add a test that requires clicking on this and see if an LLM can solve it: https://seangrindal.com/writing/cheeky-button

๐Ÿ˜‚ 1

I have conditionally moved elements by clicking the show button ;)

๐Ÿ‘ 1

Here is an SVG snake game with the manual patching algo: https://squint-cljs.github.io/squint/?src=gzip%3AH4sIAAAAAAAAE5VYX4%2FjthF%2F96eY0yGFlEJee9O8yNm4weVaBA0uQHN9EtSClsa2YpnUkbRsd7HfPRiSkihbXu9pgbVIzvw4nP9UyBXsWcmjySQscA2q%2FD%2FC4ywCAFgsYCPLws6Fj7PT4yyyVDlWFcw7KmT51s49wXxWnyyW4DmC0kzjBCBkWuzhOVGc7RDS9HuYzzJI%2F2Z%2FvqOfDBZQ8lKXrAJLthLFeQLtkxSlhHQOswxGngXsRVPyDchys9Ue11qIAtK53fCaq92RyDwuVpUNLkHLA75ETjkcJOOF2McWMpsApCFNxSXXRksRXIyzjnUvGozd6YkzVEdWv%2Bv0455wzSF9TnZ4VpBaajq12dCKlEHCFCj9kk28c4TlGkIutCOKJoNTKj0chxVqSLfICggbzCEN%2Fwoh11sI16VU2mo%2FgllkZ0mCWXSBefWMY8w9jHlE%2BhhhZRqXED6BkYjOOkrF8egUaIQOc8GVZaHTGwy3vDroinUyROOin6xgBmA2SnH2KOajFNtSx0dWVUsIhYTwBzgZpf0A5xuQFyr78QlOreP8%2BARn%2B35zK4XVegmhEnuE962%2BviGnQ6V7%2FURRdolAyiquYT35mVIiB6U711%2BzSuGIKJ4gb%2BYxxrGC9DzWWL1VbaSGXoyNaSLBSuEdqMg%2Bk8liAZ%2FLPUqohKgn4R%2FqQaH%2BhWuUDav8kHyczSz5v%2FC8EkwWkAuupajUJJyyovjYINe%2FlkojRwl%2FqIdjyQtxhGCH50IceTBmMhPMeGULt2hicIdnCKcx%2FeC11TpaL1fAoS7oh7LhvYik%2FYtS3sTtKXOmEHZ4vu%2BzEPwkpTj%2Bpw6gzTtPJrrTGcyzqH2N5%2BOhPgr2M2nwEiz20L4G7Fdc6wswqhkOKzbvbwb7NxWTYAAWe2hvBStK2bqkrQZULGOJuYY0PcE5g1xUwhgqTcz0c3KC8Fs4GcoIkjONznbkbZgcy0K72ptskaQ1A59kXVaVxX%2Fpy9GG7TG2nm7LkXHHYeXxq84L%2FN24n%2FWlNCnKxu6RJqrZwLMTJPzWdgtOaifRYHagrkTpc4XwnKyELFBCMK9PoERVFrCqWL4bjStIVizfbaQ48AKC94jr4OXFES4WNuu7YbgWEtKaSVcM%2FFD4rzkthEpLIIroBdLeLoYn2EhEHnQ2Xiz8PsGjNqoKJBZB1pOSjkE0KM2%2FirXRFR63yG%2BV6zTReLL2%2F35Gdp%2FPZpQauY5db%2BYsGlgFvUDwT9rntwbluyCLsszzMolMY7yWbLNHriHNt2VVSOS9xWkNKDEWIj8Q0dQy%2FeyG%2F3C8LjmFhVD4xQGBD2dWp6yukRcfzKqBNiQuj9NE1DWazSbmCoKt1nXy8HA8HqfH76ZCbh4eZ7PZg2o2weU5uChMK5luyzw%2F1BmE3gLYSVeCIo8OSh6rZrM0UnqF0JRsXlZLx%2BpZgXyi5JuxFX7Yr1COrayEqJDxbsmtjSj3M570J5LZ%2BF5H7ugbzLW43MFaK9VsA3%2Fp9e5o%2FCBJmdZSeSQmd%2B1ZvWw7s3bpbkeXXjK4RqMb3yssKS%2BrXpLBds4mxgjd%2BxOYZKKNm3jEiwVsGS8qhPWB57oUnFFG29eCI9fKJzWuYI685kuDNCKjVaZEBSGr6%2BpMdK6J1FLdOZSPY1rQocLfUg7c0xtiXJED9yZpnaJGDWfP1B3fkd4TZsQ5P1ZIo0%2B%2FtyF6Q4lvxLHWvHHAV7PJ%2BAkNlVGJsnZmvIBQ4ZelyzVv138HTJm4CzuXsb4Gh8KrgfcDe33TWevr5UoHSFY7LVr2StQN9OkxW3W9Fq3DzH3BeesGZYotahMA5eqgcTx0WqnSHTSZjZbXTbzDc8yppu1eOer4haZff4Igr5hSAbRwEbmJfkf9tln5RFuY80HzmnUIyrQpA6guq77KewtyoJLmfoM%2BhsFI9%2BE0ti2UPcgOmq%2Fy3BarVYzBmuZKUYnqlHNHO4ngcV6V%2Bc7Xz%2FWtyXhVYgnvKZwgS14f9FsgLeGrkPbWGE4V6p9ab7XcnbOZWtxEN53dRkJnKjOc9OCuTOutFEey7wUGJUiqFqLCKUopJAQlbxg1uraGJ8F1S9FxfiSOqRUx%2BGXIBx3j8IqhqMMnKZeQMliZlu%2BJbExzxvdZNBiuPOYtU%2FFa5Ae1hBQrx4sV0bNcl02X3b2877HXTOdb03cTDd3LrztPURXdrIlJev9k8rrla1tO92nriWL%2BwDX4jFE76e%2FRGTC0QFOJdcVy%2FODWp7boj0jXMbbxKSgb4jFzKd7WiIEEQ%2F4%2Bki8TlKlTDg5CzzhubuB1l%2F7jbgyeVcR1RemCuGHVAQ1FPzI7RGOgRrXz1hM%2Bn2vLeoVujKZPJuXQFeWD4Nrpb6QkdcL4pEYkfdKXkiwWzmP6SpIMRXX2oHXjgx3d6PYXcU4apuMZn9daemoxw3G9DDySdrncxIpswEm4a4aLVNLmIN8bPSe0WvcjWAqh3e2crip%2Bi%2FXlgPL8O1bWH4P3rK4Dz3m1eK0jC4qyCXrJrKnisoDAh7lo6uhb%2FLSWSF3CQEjkdHH3PiIYsUP630PZvtTvasL%2BC0SbVZ1G7bGJKLP7sKKIj2bJfgFLErvp4AM4fev6H5i%2FjO4pRGDZ3fufHdiZ3OoYAAA%3D

Pretty impressive ๐Ÿ™‚

You have to always return the same number of nodes, but if you do it works remarkably well ๐Ÿ‘

Here is the draggable example I wrote in Reagent in 2014: https://squint-cljs.github.io/squint/?src=gzip%3AH4sIAAAAAAAAE5VYbW%2FjuBH%2Bvr9iqkMLCaic7LUFDnK3aZvbAgWu%2BXB3xbUQjIKWxrY2NKklKdlqkP9%2BGJKiXqw4SQLEkTkznHnmmRmKsdBwZJX4ABBnCr82lULICy6%2FNApX2qhK7CFjGrRRmyT58CEucSegUMgMpjvF9kcUBvLiUPFSodiQIY4GclqD%2BIu%2BKWXRkNDKKX3vH%2F%2FhdRNSAYhLqfGrNwRjc3Z1xeoaRXlvV61pK5IkVoC%2B6J0D3e5ToSE6GFNnNzen02l1%2BsNKqv3Nt7e3tze63UfzOIQskRzPD1VRNPUG4tECuC9hx7hGu2EvB5VIdbu%2Fs17GhRSlczeWCmJR8TuvmvgoaMlBurQimuMW1dLKVkqOTIQlv7YA7s94Ng%2FkM%2B0ziHv5Fgsj5zu4bOWG7eF3A%2B5eZnACIGfGKD0SiasdxEdW30G8q5Q2YSlJxnoLP%2FlcAWKF4%2BfNawZExQdPJtv5nNgkhP8%2FQabbPRhLk5Hweg0HJkqOsGtEYSopGIdCHmspUBg9FrVUsCHvxJ21tOCjA1OhhpjVNe9IzipZ7F4JamynkELDFPDXQB39DIlYBnJCb%2FLWA7WYOBdTCN%2BLvubMAjk%2Fc6Snh5%2F6En0BxDfacdl8IcCr3WQ5QitlIdEuz0yUEGv8eud7zdvxD4aFNEPZ%2BY71HjtUXi18M8nXb0O23u9XPrHk0Omtba5U3QTPkbKD61q1Tjv3TDN5CY31GjQaWwDVtjG4XDq9V%2FkjtBtXLddT%2FIhdKtgR4fFKqEMfX17%2FBFHBmdYR9OYSoon5DcSr1K480BY2PmivZYdMadNxnJgKXfWq7ksmJ5C0r%2FXRZRuMsI9XqfXNB%2FII7buY29vqgbG2VoXWNKICOFfRWWnDlNG%2FVOYQ8IFIiuiqlk00ttQg4vQvZKXmlYFYN1s9mPk2gSiN4D0R0YR6T%2Blqo26%2ByOo9fRvilZE%2FyBOqe0Znjevpi2slIHOh2r%2FXd4pXrCw%2Fk9wPlTYoULlydAau5yJDrpGwRPO3viaddkDUnjja5MWSdvUeIrKPHwbj%2FjBiDkqeiMUzGzQGaCZKjitUSiqIKtEyXpX%2BpJJFlwenoPmZNFbOxeifUz0Iiu6nPxpqdnRt8g5yBlt7sP1ETKbvbIWzZPK4HSkfmE53smj0HeTIvS5ykmeFqdoww0bTbaReM1McIK%2BZIhmBp%2FTyfC15Gb61nYf%2Bf7DTy%2Bn1B2vqJ0KaT9TZGmFgrJj0X473CAmMnaGVwpqzAu%2F9%2BsodbRa8C4p9F5LU8%2FG08YPMTcKJB1P9gfDzNmynsTcH8Sg5%2FrsJ6%2Bb8iU8HAmmUFXk5N0Orahlv0EoMT3aHZMmohfZjz4Sfu9qpXli3STNn21gNns29FMbjt1DnwZmxqHXJnM3ck%2FXaM2aYl9nUVZ8PWrccDHKL28%2FqnBCm8CznjVEjWOzjMi4TRtIu802cy9Y4OXepMGslfQ8as3FEQoe6q2D3IrjlrHhMD5JjWksNT9kZ%2Fnh7C1lHH8%2FhddEwgxAzI49W5KMTsR%2BMVy3egVENPpPd9Rr%2BbSpemS68L%2Bj%2BTZJLTa3iDJ2tUXt4%2FDPE%2F2LmcMO2GuIUzhBn55lbSZLAn25dnHP5DuKsW5YPUQrYo0kLXqEwqcLCDj8ztAnK9x7N32Ujykrs763gjyRH5GJqjzQ8TN%2BZnzKOO7tmP1Xy%2B8zI2srKGlTSw2DniH93Uj0GR9loTI%2ByxdSvQC53O43On50IvvXenSlMe2wit%2F5jPbEgObVJ%2FruJ7H972S7IhssC6ng%2BH2foBhv0kkll5VL%2B1KfXvtg%2Fvyx2hvO1wZp10F1dn7Jo1OYdXk09QktY%2BAJc%2Fwt4rdegkNbAHNBp2ifuZ7kDdeVkplP%2Bi745VaKUJ4iCXgR%2Bqwt3SnkSg0PWlfWaSAZbzyGwNJM760lPITfPAu2eskfsNOSWRUbWm%2Be38HCUb5dUi%2F6MIgmQ0ctDRnZBkIR2Tp6D5HoNJe4qgdDJRoHFr4807mQDjCtkZQcH1iJUoz08WBAvUNzTL6SJleXL%2Bbk4gl1PzoXNpg4WwRyY8aTQU1a8dbOmjvqQRiwcmOFq%2Fb6%2FD%2FE8KRXb79mWY7ptjJECcoo9z8qqpY3z7PCRzqYpnbb%2BaovIgZNnTt43Gvd28ZT9P61EiWf4bprRrJa6og4LEdtqyRuD0UzCtSraZqGvQlSfowTWMx3bzZzKRWt1KjOFLSse94poC1EhuVSZU1tHz45Z0YM0cECFUHNkGiN3HeimYF%2F8HgdnewLEG6B4CxgXcPgdl2GYAzERDgWTWSb0TWGhP%2FSS0fd0I3vEaJNsQjtRUpo03KV5ksy5MxV3Qvb6dHzt87VB1f2E3J0eo29YXUejo6aR126JorJqR0l1B6u0KiEam5ldNG1l2a1qhXRzMe7YCkVJbXE0X8ntmP4Optxd2fimJZ%2BC0V%2B1%2BDOQC50EN24vVpbpyS65GZRlbuNxEt18APu7oZlFAk7d%2F%2F8rXxnUzdwXAAA%3D

the whole thing: 3.87 kB gzip :)

๐Ÿคฏ 1

let's try a css transition, I hardly ever use them

https://squint-cljs.github.io/squint/?src=gzip%3AH4sIAAAAAAAAE5VY227jNhB9z1fMatGCAiolu8W%2ByEjTIt2iBRZ52QX6IBgFLY0tJjSpkJQcI9h%2FL3jRzVaUjQMkJjlzOHPmQjJEaNhTJi4ASKbwsWEKIS%2B4vG8UptooJnaQUQ3aqHUcX1yQErcCCoXUYLJVdLdHYSAvKsZLhWJtgTgayO0akHt9WcqisUKpV%2FozDP8KurFVASCl1PgYgGAM51ZTWtcoylu36qCdSBw7ATvRGQe63SVCQ1QZU2eXl4fDIT38mkq1u%2Fx4dXV1qdtddOqHkCVaw%2FOKFUVTr4GMFsBPwpZyjW7DTg6YSHS7u3FWkkKK0ptLpAIiGL8JqnHwwi55SudWRLPfoJpb2UjJkYp%2BKazNkPsNn8ydtdnuM4gH%2BRYLI0938NHKDd3BzwPvQWYwAiCnxig9EiFsC2RP6xsgW6a06ZfieKw388lPFYAoHI%2FXrwEIxgdLJtuFmLgg9N%2BvIdPtDoxLk5HwagUVFSVH2DaiMEwKyqGQ%2B1oKFEaPRV0qOJe34sYhzdjoyVSogdC65kcr55Qcd684NcYppNAwJfw1UkefIRDzRE7S21obiJoNnPepdz%2BIvmbMTHJ%2B5mhHd1%2B7En2BxB%2FE8dF8wcHFbjLvoZNylGgfZypKIBofb0Kv%2BXH%2Be2AhzVB2oWO9BceWVwvvJ%2FH6qY%2FW2%2B3KJ0ienQ5tvVB1Ez5Hyp6upWqddu4TzfglNlYr0GhcAbBNY3C%2BdDqr8gdo175alkP8gMdE0D3Cw4KrQx%2BfX7%2BGqOBU6wg6uNimiXkHJE3cyp3dwvkH7VJ0LJQ2R44TqL6rLuq%2BBDmhpH2tj85jUMs9SRNnW3DkAdo3ZW6H1RHjsNJCa3tE9eQsspNqQ5XR%2FzJT9fxAJEW0qOUCja1tECT5zaLUnBkgutnoAeZjDFESwVs8sifUW0pXG3V5L9lb%2BjaQ1Mgv8oDqltq7xnL4SErL8rP19AvTBgUqX1%2Fe%2BWVyM%2BQaLTlo%2FuiKzGv3FLkrRBu%2FWKO%2BgHsT3fBiAA%2B3C1MpebBpeYJh%2B7o95CTHFJWSCiImWspZGa4eWXR%2BE%2Bo1P1uN1JsY%2FTPVg17Rf7q7nqZ73%2FduIKewcTfVa5uads6VLI0nw81IuaI62cqi0TeQIw%2B6yK08LQxr%2B0NpdFyN1GtqigrymiorI%2FCQnF%2BYJS%2F7WddK7Pc7dxx5ve6mbBuEkObatqpGGBgrxt3keI8%2BgMQDpQprTgu8Deupv6vMWNcrdm1F2iaOh3U4mfzRNrFgqj9k8GlfdcdrgAMyCk6Ym2Tdaf6QQ2VJGkVFnh%2BEfe9pKW%2FQSQwjt0M8B%2Bqo%2FdBlwrdj7VXP0F3QzJPrlAafzK0UJvA3U7i9MWNRZ5J5MqeWrFYhY4YDMJuaGuJh110O9nKz25%2FUuWXYuudy3hg1osUN53mZZKTd5XQTb7IDt8adK5y0kq4HjbNxlISedV%2FBqxXQuu4eeIYaBEKN3MNzVskWlX%2BcfR8KbiOfkv4eD7klJM9K1sJz5k%2B15%2BzASlNB9OHqqn6KzjtcViHbVWZBYEOLh52SjSiTQnL75rOVGQz63VkZQ6SwjCDa8Abnzq3MKCo0sy8PiM4Ar9JPGpBq%2FAWc3Faq%2FTA5Z9MgNmuMLihH8iH9FEf9IJ61q2S65vQI0ZbjrPeUs51ImMG9hqhAYVDNid032rDtMSlCyi%2BIep%2BjQ8XMrG9Fo7QVqCVzEN8HmUyKZC8bjYlDh%2FdEH2j9LqRKU5f2TyBDSBPPaXKkLb6q6TaN%2FnbjPUbrPuOUlGY25axCntUKgdQqsSdWCIer0nySqespnkdx%2F04YP4MeG1THr8h9843e07qORp3ayKVXU1SydhRx35cSVkI0hjl5eG1keUxrhfYmPz5TFYoSVTDTv32t2cT%2BHqD823H88sinbHVPj9BCvOtWcO33omWZHNySD0uW%2BY3HSUK2AvL%2FwP2s7f8TrIBXD9%2F%2FB5mqnaDsEgAA

maybe blending the hiccup generation with the patching would make sense so I can even avoid creating elements if they aren't used anyway

This is sounding familiar ๐Ÿ˜„

๐Ÿ˜‚ 1

I'm sitting here wondering why I have so much code

๐Ÿ˜… 1

Now a boring list crud example: https://squint-cljs.github.io/squint/?src=gzip%3AH4sIAAAAAAAAE61ZUW%2FbNhB%2Bz6%2B4KtggAZOSbQ8DZHTukHXAgKEP64A9aFpBi7TNRSZVkpITBPnvw5GURMmy0wxzUMMS74533313R6mx0HAgXCRXVzFlWwGVYsSwdKvI7sCEgaLa85oqJsorgLhmBgpcg%2FgffUNl1aJQ5pR%2B9pe%2FeN0EVQBiKjX77A1BaM6uZqRpmKB3dtWatiJJYgXwRuKdA93tUqEh2hvT5Dc3x%2BMxO36fSbW7%2Be729vZGd7toHoeQlKHjxZ5XVduUEAcL4G7CltSa2Q17OeAi1d1ubb2MKymoczeWCmLB67VXTXwUuKSN4mK3tCLaw4appZWNlDUjYljyawvg%2FsEezAf0GfcZxb18xyoj5zu4bBWG7ODrEXcvMzoBUBBjlA5EYr6F%2BECaNcRbrrQZlpIk1Fv4FHMFiBULr8uXDAhej55MtvM5sUkYfr%2BFXHc7MJYmgfBqBXsiaM1g24rKcClIDZU8NFIwYXQoaqlgQ96KtbW04KMDUzENMWma%2BhHlrJLF7oWgQjuVFBqmgL8EavAZE7EM5ITe6K0HajFxLqYhfC%2F6kjML5HxfM7z68LEv0TMgfqEdl80zAV7sJssRWikLiXZ5JoJCrNnnte81X47%2FYFhIM5ad71ivsYPl1cH1JF9fDdl6vV%2FFxJJDp7dWXqi6CZ6BsoPrUrVOO%2FdMMzmHxmoFmhlbAHzTGrZcOr1XxT10pauWyym%2BZ4%2BpIAcG9xdCHfv48vpbiKqaaB1Bby5Bmpg3EGepXfmAW9j4oLuUHTSlzWPNJqaGrnpR95zJCSTdS3102QZB7OMstb75QO6hexVze1s9MNZWVmmNI2oA5yI6mTZEGf0nN%2FsBH4ikiC5q2USzDhtEnP6IZhRralKx0cZ1JEW6jiC6aGnBISN%2Fk0em7ggeBC5jG2eE0vfoxm9cGyaYcuR3nl2OPGe1ds22%2BwL%2F4kwz81NfKW6XIVR7DuiS5GyluTIcYrGXV6MX%2Foxg9koekVwzG9idcVTJmmVMKakg4qIjNaf%2BAJFHp%2BeZQfM9amTOx%2BjXqR4Mit55f2LT5OC61xoKAht73nyLBMN7tvBIMrncBMp7otOtrFq9hoLVXpfVKE8qw7thtARDJ1BviKn2UDREoYxgx%2FT02CtrOty1DQF%2Ff7BDxen1510scyHNW2w4rTAQKib9zXCPIYGxM9Tz%2Bs6vZ%2B7EseDdoNg3B4mtmB1LP1%2FcgJp4MNUfqT7vjnZIenMQB8nx9yasm%2FMnPu4RpCAr8nScDR2kI3XLrMR4ZXdIloxaaL%2FtmfDHY%2BNUT6zbpJkH2%2B8MezB3UhiP30KFD86EotYl82DmnqxWnjHjGMuvTjdHpEcJy8XxCt1YqFtM1Vkd9Gfuep96FIPpjgtRTjsKphJxtMVljArwt5enoIabTV1d2AzzldqDUrYnOmhkyKhw28XDaabYQXbsgrcnrc8zZFKbCzjHLnnWHoZzqjCz7Nv2pC6DcnT8c71stQLSNP6BdSvVIeWCG3jKrdv4iaKTaHNGubEPj0a17Nm3JSkqBtoQwyAmRh7gKSeCH0it4en5zPjIcctx3%2BexxRFKU6f%2BBgrb1fSRNG%2F6DbYCCvtzYfh5Ntupk%2F7oNdxONqyzE49TNwJiRQSVh7RtOT0zXmOitaxSLrz5YoiV07KHz37lnAKnz0mSwBid48oYIDmJsG2odbs3SzluCDGaI8EocHKXLA2ejj56KyVa6g1tOatpykXTmtQ9iqorgOh3ZlqFj4D%2B%2BVSB2RPjt9Xgqo8LsBk%2FkOabK4BWUKZw9H8DRzwzOaGtkgeQ4m5PxM4fP5BahdW8Z4%2FWccyrz6kPApfDDNhwUD68GWcZMEgNUTtmwPWEcFi7sOxcX0Nh%2BTawx9WUy9i4Eigj28mmZg4cKByKKadWG8fnjhkE%2BN2cC4PkWDL%2BHUGRO2NPuTvbPuUbqRC16LvmAbTEA8imJtV9NCud3OAEgQj7%2Fqwyc4fzl3iDwZazOsiH3Fy%2FxJ%2B5JVtnX0HWJyDrM%2FBc%2BmibV7hVBl3AreGZzzPb1ra7fd5kz%2B8xwqFjxWPzctJJ76JRTrrIDYVilvTeYhnK5JvWGClgtco2RuC%2FtFH8QNRj1rR1nSq%2B25sQ5Kecco1WqX8in%2FCSzMYDJqTm1b2rirOnfDdF%2BqjOn9PjWavwND9r9rQbLTaRgNogpEmSCWGxPAbAo4%2BkYxFE7yk30VkswYI5AmhxpUhMNcWyh%2Bc6nrVTn9iJI9Ff7e3tzz9EZVmGbVgzk2LRLw0Z12lmI%2BqEm3bZKvcUwoD%2BlyKH19X5OOEWStvz%2BGxpB8oXqrm8%2Bq%2Fkv0z92O3%2Fbmi9U98rm%2BeX6iA4MpxndZDyCVWjnyiNxvjKcpZn3eeY8s4LYTSWr%2FaX%2B07xtXrD%2BvybPSN0oHnPX7wPET4URqW%2FCH6UQ0PaSOqnHD4eufCLT0DKKQZ%2FP%2BX37NE%2FvY4dM42G08KUXkXQVcmEKvFQ3O8m3aEIuF6WATZKSpMOr6lnEF1%2FKvJGMYgbhbD0Nh3GfqOZLV%2BF%2BN8W4evWzy1Tjx9Z7R4Po2vSNFHwLGnkpbezEeVd8H7FPTnhuIlCM7MXvAh91iiGbwzDg4Ri9mxTjLPIuh3j92jKvaMO33AWU6T6V5z%2BaO9CR8HS7YVUPtolf3rN3caT1op0%2BAT2r0Rio4BT97%2F%2FBSti0ZsuGwAA

(made a few fixes to the patching thing with respect to false attributes etc)

Please donโ€™t shelve Euxalypt! I just was fiddling around to see if I could build something very minimal. What I have now I more close to Replicant than Reagent and I donโ€™t think Iโ€™m going to implement full Reagent. I am deferring people who want this to Euxalypt

No I won't shelve it. I just meant to say I'm more interested in the end result than the project itself. I'll try to get the rest of the Preact tests ported over.