Please give new panel plugin "Layers for Developers" a whirl

Since it’s open season discussing panels, for those of you using the panels pre-release, I’ve got a whole new version of our “Layers for Developers” plugin, written from scratch (instead of the big hack mash-up) with what I believe is a very sophisticated UI for exploring the selection/root (whole scenegraph).

I’d love to get pre-release feedback. is the download page, with full documentation.

Here’s a screenshot to whet your appetites.


Awesome. Thanks for creating this for us. Seems super helpful!

You’re most welcome. We developers need all the help we can get (or give ourselves!).

I’m furiously adding documentation to the product page as we speak.

And thanks to you and all the XD devs, for creating such an incredibly productive environment. I haven’t had this much fun in decades, nor have I experienced this kind of development velocity, perhaps ever.

This is an amazing plugin!

One note, I profiled it very briefly, and you are stressing out the panel layout engine, that is not designed to render huge Dom trees. I stressed it by going deep with the slider and then selecting a large chunk of my document.

Have you considered using a virtual scroller like React-virtualized or React-Window?


Thanks for the kind words!

I just finished this first release today, so, no, I haven’t thought about efficiency at all. :wink:

(Other than the small one of not rendering properties (or whole sections of properties) if they’re not expanded, using deferred children rendering in React.)

And it was really designed to inspect a few nodes at once, so there wouldn’t normally be huge DOM trees in the “layers” sub-panel.

Even then, if you don’t expand the whole tree with the slider, it’s only looking at a few nodes at a time.

But, yes, I’m sure you can stress it badly if you give it thousands of objects.

Do you think it’s worth looking into virtualization?

I’d be interested to hear if people at Adobe found it useful or not. If you did, I’d be more interested in making it more efficient…

1 Like

I am not a designer so I’ll leave others comments on usability, I do think getting developers to introspect a design is important and I know we have that on the website for XD design specs.

I think virtualization is needed because we won’t have the time to optimize the DOM in the near term - all our complex UXP UIs are virtualized (file lists, plugin manager list, asset panel, libraries panel). So no matter what, learning it will help you build other great plugins that are performant.


Great point. Will investigate.

Looks like react-virtualized-tree (which builds on react-virtualized) would be the way to go.

Thanks for the feedback!

We’re up to a 0.5.1 release with an important bug fix. (I’ll stop talking about it now. :wink: )