Vulcan: Inspect your database in your browser | Hacker News Reader

Vulcan: Inspect your database in your browser

firebase.com

42 pointsjamest7 comments

I'm the dev/designer at Firebase who made Vulcan during one of our experiment weeks. I've been using it for pretty much all my Firebase development since. Let me know if you have feedback!

This looks and performs pretty great. Good job! Is this going to replace Forge?

How much large of a list have you opened up in it? 1k? 10k? I don't have a Firebase with a ton of children off a leaf or else I'd test it myself. ( =

I notice that it's a DevTools panel. I expected it to be able to read the Firebase I was using in my app, but it asked for a URL instead. Since it's not related to the app I'm looking at, maybe it should have its own page instead of being in the DevTools? Or be a separate Chrome app?

The security permissions ask for all my data on all websites, but doesn't it really only need to read *.firebaseio.com?

Thanks! You can open fairly large lists (thousands of items). 1,000 items works with no problem. I currently have one open with 10,000 items and it renders. At 10k there will be some performance issues related to rendering that many items in the DOM but it works. In the future I'll probably add a way to detect the number of nodes and intelligently render only items in view to increase performance.

You can insert Vulcan directly into a webpage by following the directions here: https://github.com/firebase/firebase-website. A future feature will be detecting the Firebase URL being used on the page.

You are correct I technically do not need all your security permissions to install vulcan. I plan on fixing this notice, it seems to be the default in the chrome store.

Thanks for the feedback.

What does it do when there's 10k items? Is there a search or are you scrolling through all of them to find what you want? Is each expansion a network request to get the fields of the child?

I've been thinking a lot about how to solve this and I don't really have any answers. Curious if you're doing something different.

Currently Vulcan just displays a long list which is not ideal. However in the Firebase Dashboard we do implement a solution for this. The approach I took there was to truncate the list at 1000 items and display something like [3,332 more items...] as the last node. When you click on the last node it displays another 1000 items, etc. Adding search to the existing implementation would be ideal.

When you open a node there is not network request, there is an open socket connection that data passes through.

Its usually not necessary to display all items in a 10k plus list as there is generally no use case for a user scrolling through a list that large. Search and showing a truncated list that renders efficiently would be a good approach. Ultimately the problem we are tying to solve is helping a user find the data they are looking for. hope that helps.

It does, yeah! Thanks for letting me pester you.

>Fast forward to 2014 and Chrome’s DevTools now leads the way in helping developers debug JavaScript

I wouldn't say Chrome's DevTools are significantly better than Firefox's native JavaScript debugger. Both are pretty identical in terms of features when you look at the latest versions.

Reply on news.ycombinator.com