Components: react-aria

submited by
Style Pass
2021-06-09 16:30:08

Placemark has plenty of moderately complex UI patterns that benefit from React component primitives. We’ve got dialog boxes, tooltips, popup menus, things you can drag, search boxes with autocomplete.

Building these from scratch is usually a bad idea, because you’ll implement the parts you notice, like the visual effects and experience of clicking around, but miss all of the things that are important for other modes of usage, like how the components interact with tab focus, keyboard shortcuts, and ARIA roles. You’ll have to solve hard problems from scratch, like how to position a popover in a way that works with z-indexes of other parts of the page.

When I was working with Rails, the default answer was Web Components. Web Components are… controversial. Folks like Rich Harris have described their issues well. For that project, they worked great, because we had limited expectations, stuck religiously to GitHub’s battle-tested components, and did a lot of server rendering. So the autocomplete results in an autocomplete UI were rendered by the server itself, rather than transferred as JSON.

Placemark is a React app, and does most of its work in the client. Web Components could fit in a few places, but there are many more complex interactive situations you trigger, many more dependencies between parts of the UI. It is, as I’ve roughly described before, a good fit for React.

Leave a Comment
Related Posts