156 comments

[ 2.5 ms ] story [ 104 ms ] thread
I remember using Firebug for the first time and being blown away by the real-time editing of the DOM/CSS, it saved my F5 key from certain destruction.
Thank you for the amazing contribution and for for making it a little bit easier to debug during a time when debugging was even harder. Firebug set in motion the browser tools that are bundled today.
i will miss you firebug!!! I loved when i could open firebug + native dev tools... that way i could navigate in html with firebug and make css changes on the native dev.. on the same screen!

Now i can only open the native dev tools and i can only view either "Style editor" OR "Dom navigation" but not both at the same time.

Will miss you firebug as extension!!

I guess this is the right place to point out to people reminiscing that if you open Firefox dev tools and click the options cog, you can select a Firebug theme.
Not the same thing...

The Firefox dev tools' Firebug theme gives me the illusion that I can click the network tab and find that old, reassuring interface. And instead it's the (in my opinion) less functional one from dev tools.

At that point, I prefer ditching the Firebug theme altogether, and embrace the loss. :(

I did that, but I'm not seeing the same functionality. It seems to just be a skin.
Firebug didn't just raise the bar for web debugging, it pretty much raised the bar for all debugging tools. It leaves a great legacy with the built-in dev tools. Great project.
Whoa. That's pretty hyperbolic. Firebug is definitely cool but things like SoftICE or the Visual Studio debugger were amazing.
Don't forgot it was mostly imitating IE6's Internet Explorer Developer Toolbar. Even though it surpassed it pretty fast! go open source!
Visual Studio did front-end web debugging back then?
The parent claimed the following: "Firebug didn't just raise the bar for web debugging, it pretty much raised the bar for all debugging tools." I dispute the idea that Firebug raised the bar for non-web debugging tools.
firebug took a while to have a proper javascript debugger. For a long while, you could only ever have breakpoints using IE+VS... But it was a crapshot if your code had too much DOM interaction. The debugger itself would crash (and offer you to debug itself heh)
It sure did. You had to use IE to do it, which some people disliked.

That usually wasn't a problem, though, because you had to support IE due to its market share.

Yep it did.

Windows had one of the first JavaScript debuggers, due to JScript.

Electron already existed as MSHTML packaged apps.

Everything old is new again. Oh the horrors of HTA!
The Electron generation seems to have a hard time understanding why consumers never liked HTAs.
Yeah, SoftICE, I remember buying Hackerzvoice (a French newspaper-like hacking magazine) which included SoftICE tutorials on how to crack WinRAR license verification. (for educational purposes of course)

I was amazed that I could breakpoint and debug any running app. I miss SoftICE.

I read this a while back from someone who work for the company which owns SoftICE copyright : https://reverseengineering.stackexchange.com/questions/1445/...

Any idea what people use now instead of softice?
It depends on what you are trying to do. Softice was good for "kernel" debugging, rather than just simple user space programs for which things like turbo debugger (and more modern solutions), were as good if not better.

For windows kernel debugging, there is windbg, kd, and assorted "emulation" methods like qemu's gdb stub. Similarly for linux/kgdb/etc... OTOH, Softice had a number of OS data structure aware commands in the late 1990's which are only really available in something like windbg. In theory you could write kgdb macro's to perform most of that functionality for linux/etc but it doesn't work out of the box.

Although in the end, the logical replacement for softIce, is a JTAG debugger of some form. A fair number of the ARM platforms work with DS5/Dstream which provides source level debugging with far more functionality (for example trace level timing information) than softice as an "ICE' ever did. I guess its the same for intel's ITP-XDP3/system studio products these days.

Again, it depends on what your trying to debug. AKA do you need the "ICE' (aka JTAG these days) functionality, or are you just looking for a powerful kernel or user-space debugger.

Ollydbg on 32 bit windows

x64dbg on 64 bit windows

IDA Pro Debugger/GDB/LLDB on Linux/OSX/iOS/Android

GDB everywhere else

as StillBored said, windbg for Windows kernel debugging, but I've honestly only used it in exotic situations for .NET debugging

I've been poking at radare2 for a while now. Really great CLI debugger (works in windows as well).
IDA Pro, WinDbg, OllyDbg, Radare would be the first ones to come to mind.
Wasn't SoftICE a bit of an overkill for cracking WinRAR? If memory serves right, it was a tool mainly for debugging kernel-level code (drivers) -- that's why it had to start before windows. WinDBG and similar userspace tools should have been just as good (or even better, as they woudn't interfere with WinAMP :)) for dealing with userspace processes.
Totally overkill yes, but without internet, you use whatever you're able to put your hands on ;-)

Ironically, the first software I cracked, well tried to, was an IRC client named Klient if I recall correctly. I bypassed the license check, but, this software included a functionality which, when it detected this, broadcasted to everyone (except me) that I was using a pirated version and that I was accepting the CTCP reboot command :-)

This may have been posted in 2008, but the tech it is demoing was decades (yes, plural) old by then: https://www.youtube.com/watch?v=1kuoS796vNw This video is a simple demonstration of very mature tech, not a demo of something hot and new.

That's a demo of a Smalltalk environment with the programmer deliberately writing some code that crashes, going into the debugger, adding the method on the fly, and then having the original method call complete despite the method not yet having existed.

It isn't quite true that there is nothing new under the tech sun... but there's certainly less new than most people seem to think.

Firebug was free and ubiquitous. Unless you were in a MS shop, the likelihood of having Visual Studio are minimal.

Firebug was a quantum leap in terms of HTTP/JS debugging.

Huh, I've never heard of either of those.
Not really. It's not that other debuggers didn't provide some of those features and were very good at, say, stepping through program logic. I've spent many years using other debugging tools for C/C++ and Java, and although there are some good IDE's out there, firebug's capability to analyze everything from logic to object models to network activity and visual presentation details, in such a well-integrated and user-friendly way was frankly unprecedented.
I'd say Firebug did for browser debugging what jQuery did for closing the gaps between browsers.
I often argue that Firebug is the reason Firefox is still around.

It was easier to develop on Firefox and then debug on IE. So a lot of websites worked on Firefox even if the management team didn't care (or even, in our case, when they told us not to support Firefox and we nodded and did it anyway)

> It was easier to develop on Firefox and then debug on IE.

A long time ago, the company I worked at had a website which worked only on IE, because it needed a specific ActiveX control for streaming video. But even though it would never work on Firefox, the developers still made as much of the site as possible work on Firefox, because whenever IE popped up an unhelpful error message ("Object expected" and others), reproducing the error on Firefox gave a useful error message.

I find this to still be true today of Firefox’s error messages versus those of other browsers, though Chrome’s aren’t as bad as IE’s were.
I think a smaller reason is that Selenium for the longest time supported Firefox as the simplest default.
100% why I didn't even consider trying another browser
> or even, in our case, when they told us not to support Firefox and we nodded and did it anyway

The same happened to me at one particularly bad place I worked. Even more amusing is that we we're writing a web crawler based product and without inspecting the crawled sites in firebug our product wouldn't have existed at all.

And now I would argue this is why everyone I work with uses Chrome for development. The debugging is superior.
Superior in what way? I suspect it's more a case of what you're familiar with rather than something which is clearly superior.
Does FF or Firebug have a way to override assets with a local directory? I haven't found it, and that alone makes my debug cycles a lot slower if I'm editing CSS.
If you're talking about CSS in particular, you can import existing CSS documents using an option in the Stylesheet Editor tab.
Firebug was the greatest thing to happen to web development. Honestly I still prefer it to the native dev tools. I especially love how most things go to the console so I don't have to jump all over the place to find the information I'm looking for. I absolutely abhor the network panel in Chrome. It's like they're purposefully trying to make it difficult.
I can assure you - you're not the only one who hates Network Panel.
It's definitely one of the weakest parts of the Firefox dev tools suite. I quite like Chrome's network panel though.
I consider Firefox's Network panel more useful than Chrome's. Having the ability to edit and resend network requests out of the box is exceptionally handy.
On the other hand, having it always be a 2 step process kinda stinks. I haven't yet seen a way to just say "replay this request". The editing is nice, but I almost always have to just replay, quickly, and I can't do that in FF, but can in Chrome. Might be 20% of the time the 'edit and resend' is a handy/useful functionality - 'replay xhr' is handy the other 80% of the time.
Copy the whole thing as curl, then go to postman and import the raw text of the curl command... Edit and replay all you want
I noticed in recent firefox-dev you can now expand XHR requests directly in the console which then pops up a mini network panel.

I don't know how long it's been there, I noticed it today but I might have simply had XHR logging off previously.

I just noticed that this week as well, although like you I have no idea how long it's been there. Pretty nifty little feature.
It's been here for a long time, but by default the console has several filters disabling some output, including XHR. So most people don't know about it.
> I absolutely abhor the network panel in Chrome.

What do you mean? There are plenty of ways to filter down the activity tab in Chrome if the problem you're experiencing is that the volume of requests is too high to be useful.

I am more at home in FF so this might not be true for Chrome... Just look at the simplicity and elegance of Firebug net panel (https://2r4s9p1yi1fa2jd7j43zph8r-wpengine.netdna-ssl.com/fil...). I love Mozilla and respect them immensely, but any change they made to Firebug was for the worse. If they just copied the functionalities and design the result would be much better. I am very sorry I had to stop using Firebug. RIP!
Why would they make their own. I wish they took over firebug.
You can get a similar view in Chrome by turning off the filter button and the two view buttons in the network toolbar, then ctrl-click on any of the columns in the table to hide the ones you aren't interested in.
Yeaaaah... not a Chrome-phone-home fan, so I'll make do with what FF has to offer. But thanks for the suggestion, hope it helps someone else. :)
Then why not use Chromium? You get the same development experience with less Google.
If I were to guess, it's probably the same reason I don't like/use Chrone Dev tools, it seems overwhelmingly noisy with options/information I neither need or care about. Firebug was basically the opposite of that.
I just don't trust the devs behind Chromium (who are mostly employed by Google) to care about their users' privacy. Using FF is my way of voting against that.
Too simplistic. I find that view to be severely lacking in any useful insight
It is interesting that Network Panel in Firefox has built-in simple Postman-like tool [1] for editing request which you have already made.

[1]: https://imgur.com/a/hBkmq

// Chrome has copy as curl command.

// firefox has copy as curl too, fwiw

but yeah, the edit-and-resend tool is amazing

You should log out and back in if you haven't already. That screenshot contains almost your entire session token.
Yeah, I know. I made that screenshot, signed out, uploaded this file, then logged in to post my previous comment. Thank you for reminding anyway :)
Great for cheating at Facebook messenger games. Just send whatever score you like!
One would assume that the remote end doesn't trust user input...apparently not.
huh? How can one love firebug over Chrome Dev Tools? With the latter being just as revolutionary as firebug was when it first came out.
Revolutionary in what way? What could you do in Chrome Dev Tools when it first came out that you couldn't do in Firebug at the same time?
I think revolutionary as how Apple defines the word. They weren't the first but they sure had the panels running the smoothest.
Boy, I missed the time when we used "revolutionary" for, you know, revolutionary things.
That makes no sense, GP stated the chrome devtools were just as revolutionary as firebug was when it first came out. Not just "meaninglessly revolutionary" but more revolutionary than the one tool at the origin of all modern web devtools.
I don't remember precisely the feature set of Chrome devtools in intial version. I should have clarified. The current iteration of Chrome Devtools compared to firebug represents a revolution in web debugging capability
Wasn't the initial version of the Chrome dev tools just the exact same as the Apple WebKit/Safari dev tools until Google started fleshing them out? Or am I misremembering history?
It really was. I actually quit web development a few months before I learnt about Firebug because Internet Explorer was causing me loss of sleep (seriously). When I discovered Firebug I almost wanted to start doing it again, but then I quickly reminded myself that it wouldn't help with IE6 retardation.

I was really surprised to see an inferior clone appear in Chrome. I then started to hear people talking about Chrome dev tools and would always ask, "did you not know about Firebug?", and the answer would be no. Strange.

Things instantly became real when firebug for IE came out. To me that one tool made a front end web development career a viable option. Do y'all remember JS before Firebug? ouch
alert()
There was a very capable javascript debugger as a mozilla plugin (don't think it was an addon), years before firebug/browsers dev tools had one. It don't remember the name, it was something with a V.
Firebug was neither the first for step-by-step JS debugging, nor for poking at the DOM. Those two things were within the purview of Venkman—the original Mozilla JS debugger—and the DOM Inspector—Firebug's predecessor created in 2001 by Joe Hewitt, an ex-Netscape/AOL employee and the original author of Firebug itself. Honza's timeline is off. I've left a note in the blog comments about this.
Or, easier without popups, logging to a div (hidden or at the bottom) that you could expand/open up to see output.

Firebug was revolutionary not only for the console but the inspect tool was very needed as layouts and CSS progressed where outputs weren't enough.

Which didn't help much when there was a syntax error somewhere close by causing the browser to silently terminate parsing/executing the code. At least these days the browsers tend to dump error messages into the console when this happens...

In theory that could have been caught by a good jslint/syntax checker but those were a few years in the future too. Early, JS development really sucked, its only slightly better today..

> Which didn't help much when there was a syntax error somewhere close by causing the browser to silently terminate parsing/executing the code.

I recall a dramatic bug where, in 2012, I rolled out a new version of a web GUI with some JS mixed in it to an intranet audience of IE 7 and Firefox users. It initially looked good, but then reports came in that IE users couldn't use one of the buttons. After much debugging and confusion, it turned out that there was a trailing comma at the end of an array literal (i.e. `[1,2,3,]` instead of `[1,2,3]`). Firefox accepted that, but IE 7 didn't. (I think IE 8 added support for trailing commas.)

It is not async, though. Remember being young and having a bug I couldn't reproduce when alerting the state.
> Do y'all remember JS before Firebug? ouch

Most people debugged with alerts or document.write-ing in the page. The "wokest" were aware of Venkman (Moz/FF), Script Editor (IE) and the Visual Studio IE integration (also IE), all of which were pretty much just JS debuggers.

Venkman worked the best but the UX was a horrendous mess, SE and VS were less visually messy but (likely due to IE) frequently got lost entirely and were completely unable to debug the JS toplevel ("and "modules" were not really a thing back then, so much of your code would live in the JS toplevel).

This was also the epoch of Drip, an IE webview which would just reload a page over and over checking for IE's infamous DOM leaks.

God I so don't miss it.

Firebug was definitely a pivotal moment, a complete perspective shift for the field.

Heh I still debug JS mostly with alert() calls.
alert("JS debugging was so fun before firebug!");
In my first job, about four years ago, my first task was to make certain modifications in firebug for our company's internal use (mostly in reporting and filtering).

I didn't even know JS to begin with. Jan Orvadko, the lead maintainer of Firebug, is an amazingly approachable & affable human being. He helped me a lot in the IRC channel, in going through the firebug codebase.

I know Firebug was great but it didn't usher in Web 2.0

> Jan 2007, Firebug 1.0 The start of Web 2.0!

O'Reilly Media Web 2.0 Conference was in 2004

We than had the infamous Time Person of the Year "YOU" "TIME selected the masses of users who were participating in content creation on social networks, blogs, wikis, and media sharing sites."

That in itself doesn't mean much. At the time it was said that Web 2.0 is like teenage sex: everyone is talking about it, almost noone is doing it and those few that are doing it are doing it all wrong. :)

I do agree that Firebug (as much as I miss it) didn't have much to do with Web 2.0 though.

I just hate how everyone has their own meanings for "Web 2.0". I wish the modern, JS-dependent web was versioned 3.0 or something.
For those that have made the switch in the Firefox Developer era, do you find the developer tools as good as Chrome's?

In the last week I've made the switch back to Firefox (Developer) and it's been awesome. I haven't had done any front end work yet so I haven't used the developer tools, though. I never really cared for the ergonomics of the Chrome devtools but I was really familiar with them and could efficiently profile/debug code.

I consider most of the tools on par or better than what Chrome offers, with the exception of the performance tools. I find that Chrome makes things to clearer to folks, and the panel is easier to work with.
Theyre OK, but I find the dev tools on chrome have a much better UX.

I particularly dislike the console in FF which is just one tiny input at the bottom of the window. Overall ff devtools also seem slower to open and clunkier.

They trade off. I think I still prefer the Chrome performance and memory tools but the inspector, debugger and most other tools I prefer in Firefox.
I'm really concerned about how much weaker the new WebExtensions API than the previous extensions API. Just today I saw (and submitted: https://news.ycombinator.com/item?id=15542316) an interesting article about Keysnail, an amazing extension which is impossible to turn into a WebExtension — all because WebExtensions (apparently) forbids overriding C-n despite allowing override of other key sequences.

I'm very concerned for the future direction of Firefox.

Given that webextensions are not just a firefox thing: HN's probably the wrong place to voice that particular concern? We're losing a number of sweet addons with the switch to web extensions in Firefox specifically, but in terms of cross-browser gains, web extensions rather than "these things only work in this one browser" still seems the right way forward, and it's just another web spec so if we need more out of it, let's get the attention of the people who draft that spec and get them to given more access to the things we need to bring back the functions that made life better.
> Given that webextensions are not just a firefox thing: HN's probably the wrong place to voice that particular concern?

Why not? This thread is about losing valuable capabilities due to the migration to WebExtensions. Firebug was possible in the old extension system; it's impossible (as I understand it) with WebExtensions.

> in terms of cross-browser gains, web extensions rather than "these things only work in this one browser" still seems the right way forward

Do they? Is working on multiple browsers really that useful for extensions, many of which exist specifically to modify the behaviour of a single browser? For that matter, ISTR that WebExtension aren't really cross-browser — there's still some customisation required.

> if we need more out of it, let's get the attention of the people who draft that spec and get them to given more access to the things we need to bring back the functions that made life better

I don't disagree. Why not do that before eliminating useful functionality?

My concern is for Firefox's direction: it has spent the past several years removing useful functionality (most recently extensibility, but also the security of its previous Sync product, which is now thoroughly compromised) and adding extraneous functionality (e.g. Pocket, Hello, even containers[0]). I'm reminded very much of how the GNOME project went off the deep end, removing functionality (twelve years on and it still can't replace xscreensaver) and features because they thought Linux users want simplicity.

Likewise, Firefox and Mozilla seem to have been taking a series of decisions based on an IMHO inaccurate read on Firefox's userbase and that userbase's desires. I believe that Firefox users use it because it is philosophically better: freer, more secure, more private, more open than IE, Chrome or Opera. I think we're fine if it's practically worse, because we know that in time philosophical quality will lead to practical quality, but the reverse rarely happens if ever.

[0] Firefox has supported profiles for years; profiles and containers have significant overlaps in functionality and I think profiles are more usable.

I loved Firebug until chrome's devtools got so good and fast. Chrome's devtools is a main reason why I use chrome so much.
It seems like they open sourced Firebug, developed it and now are taking it private by integrating it into Dev tools.

As, a-side, I feel like users are going to, at some point get tired of building communities and applications to have the mature manifestations be yanked into the corporation and turned into a paid product. Not saying this is what's going on here.

Look at facebook pushing tests on paid Feeds. So users build facebook, businesses build facebook and facebook has the audacity to test paid posts in 6 markets across the country.

When are we going to stop the madness of being web-based surfs, indentured servants, building the new world with no property rights? The current licensing structure of information across the web has to change. There is no organized money behind the users. Until Users organize to build collective power against the usurious user licensing strategies we will continue to be exploited. Look at Hulu circa 2010.

FF Quantum seems to usher in a new era in browser development.

Upgraded CSS Engine

Upgraded Render Enginer with WebRender

And now integrated firebug support.

Exciting stuff.

WebRender is coming but absolutely isn’t ready yet; it’s not even turned on by default in Nightly (although I use it on my home machine and it’s getting a very good very quickly).
And there is no integrated Firebug - just replacement.
> The good news is that all the capabilities of Firebug are now present in current Firefox Developer Tools.

> Firebug 3 ... was built as an extension to built-in Firefox devtools and eventually integrated directly into devtools.

I miss Firebug for one simple reason: It detached from the browser window as a singular window that provided developer functions to all of your browser tabs. In modern Firefox and Chrome, each tab has its own distinct developer tools panel that can be detached as a separate window for the operating system's window manager to handle.

Firebug's behavior was somewhat analogous to "MDI" in legacy GUI applications, in that a single window handled multiple views. The view switched with your browser's active tab.

The funny bit is that the stack of developer tool windows we end up with today is reminiscent of the stack of browser windows we had prior to the advent of tabbed browsing.

The relevant Bugzilla bug:

https://bugzilla.mozilla.org/show_bug.cgi?id=1219917

I hate juggling dev tools, opening, resizing, detaching them one by one, for each tab. It fucking sucks.
It feels like Firebug’s had a longer farewell tour than Barbara Streisand.
Joe Hewitt and Blake Ross have really left their mark. I wonder from time to time what they would have created if Facebook didn't acquire Parakey back in 2007. Hopefully, they will collaborate again in the future.
I appreciated firebug back in the day, but a few years ago the devs decided to force a white background to it, which did not work in our darkened media studio. They would not reconsider (not the first time I’ve had a run in with white bg fascists; they’ve now taken over the prefs panel).

Thankfully moz dev tools were getting to be just good enough around that time and supported a dark theme. Last time I ever used firebug, thanks for all the fish.

"The story of Firefox and Firebug is synonymous with the rise of the web. We fought the good fight and changed how developers inspect HTML and debug JS in the browser. Firebug ushered in the Web 2.0 era. "

I love, used and appreciate firebug as much as the next guy but this is a bit much. Its a great product that helped alot of people it's not an ideal to fight for nor "ushered" in web 2.0.

Could the web be what it is today without the dev tools?
I was building web products professionally before and after Firebug and the difference was staggering. It opened up the full possibilities of CSS and JavaScript like no other tool before it.
Having been a developer since Web "1.0" it's not exactly wrong, but I think you're interpreting that incorrectly.

Without Firebug a lot of the JS development that was basically required for Web 2.0 sites would have been much much slower and even more complex to maintain.

It didn't create Web 2.0 (arguably that had been a thing since 2003-2004, and the term dates to ~99) but it did usher it into mainstream development due to making it less painful to create that content.

Do you not remember what it was like in the years (nearly decades) prior to firebug? alert() still gives me nightmares. Firebug was easily as huge as AJAX, ES6, and other such milestones.
edit: wldcordeiro pointed to a UI that looks nothing like what I have as a UI (in Firefox 56)... removing my comment until I can figure out why.

edit edit: Apparently the last time I tried to install Firebug it instead asked me to just make Developer Tools look like Firebug, which is definitely a bad idea.

Firebug taught me css. I'll miss it. I hate the built in tool.
Same here. I wish there was something like Firebug for Android Studio. Unfortunately it isn't exactly the same idea. MIT app inventor is to simple.
Does anyone know the history of the `console` object? The first time I ever saw it and used it was with Firebug, but it occurs to me that I don't know if Firebug invented it. Did it just decide to inject this name into the global namespace? And having it become a common API across multiple JS environments was due to its popularity in Firebug? Or was it somehow already in JS and I just wasn't aware of it up until that point?
I remember we had to check for its existence before using it, monkeypatching it to noop if not found.
Firefox had a Console window which displayed error messages from the very beginning. But I have no idea if you could log to it.