全部文章0

Hacker Newsbaldvinmar··访问 1

Jelly UI: Soft-body physics for native HTML form controls

原网页

Article URL: https://jelly-ui.com/

Comments URL: https://news.ycombinator.com/item?id=48981620

Points: 633

# Comments: 191

Hacker News 讨论

634 points · 192 comments · 查看原帖

  1. jlukic

    Saw the window was a bit laggy so thought I'd delve deeper to figure out what was going on. This lib runs a a RAF animation loop every 8ms across every component on the page that causes the entire document to repaint. The comment above appears of the AI generated sort: // One shared animation frame: step every live component, park when idle. // The delta is capped so a background-tab pause never becomes one giant step. The "JellyEngine" instead of just calculating the jelly animation on pointer events is recalculating for every active component on the page every frame. This is the kind of thing usually a human notices and says 'dont do that, that is kind of crazy'.

  2. odo1242

    Looks good overall. My main complaint is that the animations don't all seem to go together - the "Jelly" style of the toggle switch or button (which has squish animations that respond to pointer location) is WAY different from the "Jelly" style of the checkbox (which just resizes), for example. Also, some Jelly buttons animate correctly when you move your mouse over them mid-click, while some remain stuck in the original position when you clicked them.

  3. TurkTurkleton

    Cute (and I mean that sincerely, not sarcastically), and I appreciate that it appears to gracefully degrade for `@media (prefers-reduced-motion: reduce)`, but for the demo site, it would probably be a good idea to allow the user to override that without having to change their system settings, or at least alert them that they won't see the animations.

  4. orliesaurus

    If I were younger I would love this. nowadays I spend most of the time tweaking websites to remove this stuff using local stylesheets...or using dark + read mode... how times have changed.

  5. itishappy

    I love this, but it does not seem to conform to standard UX best practices. If I click and hold then move the mouse away to release, I assume an element should not register that as a click. As-is, this is inconsistent: the button registers a click, the checkbox does not.

  6. NiloCK

    I like this a lot and am going to experiment w/ incorporating in my early literacy app. Heads up: the "See it live in the showcase → " links in the API documentation do not go back to the showcase - they just reload the same current API section. Question: maybe I've missed it, but what exists here wrt distribution / packaging / bundling / source availability? I see MIT listed, but no repo. I see src=" https://jelly-ui.com/package.js " as a sourcing import, but obviously I'm not going to bundle foreign assets into my app.

  7. jszymborski

    This comment is for like three people on HN, but anybody remember when Paul Neave had a website/blog/showcase (c.2007-2010ish?) where the borders of the page had similar jelly effect? That was achieved with Flash back in the day. Neave was a personal hero of mine back then... hope you're well if you're reading this!

  8. gloosx

    I don't fully understand the "soft-body physics" part. What's that supposed to mean? Looks like a generic UI library, not a really good one. opacity: 0.5 for disabled elements is a crime. pointer-events: none on disabled elements and claiming WCAG AA compliance? Ew.