How Does FireFox Work? Source Code Walk Through?

Question

I'd like to learn how FireFox works behind the scenes. I'd like to understand the source code and the different components but the code-base is rather large and I'm not sure where to start.

I'm wondering if there is some sort of walk though written up by anybody either from the firefox team or from outside the community.

I've looked a little bit at: https://developer.mozilla.org/En but I don't see anything that screams "Start here". I'm simply trying to review their code base for [self-]educational reasons.

Thank you!

Regards,
Frank

Answer 1

One way to start would be to look at some recently fixed bugs in Firefox (see Bugzilla) and take a look at how they were fixed.

That said. The Firefox codebase is very large, and it's likely that no one person understands all of it, so it would be a good idea to start off with a small section (say favorites), and try finding the code for it and looking at how it works. Again, resolved bugs and the files they affect would be a good way of identifying some relevant code to start with.

Answer 2

Seneca College in Toronto has a program geared towards exactly this -- beginners to Mozilla development.

Check out some of these links:

Real World Mozilla

Fall 2008 Weekly Schedule

Some labs if you want to dive right in:

Lab: Learning Collaborative Development (Fall 2008)

Lab: Building Open Source Projects (Fall 2008)

Lab: Real World Mozilla - Source Code Reading

Lab: Working with Patches

Lab: Dive into Mozilla - Debugging Mozilla

Lab: Thunderbird Bug Fix

Lab: Modifying the Browser

Lab: Modifying Firefox using an extension

Lab: Real World Mozilla - First XPCOM Component

Lab: Real World Mozilla - Adding chrome to first XPCOM component

If you need any help, use IRC: #seneca on irc.mozilla.org. Don't worry if you're not a (Seneca) student, lots of people around the world (people from Seneca, people from Mozilla, and others) are in this channel, the purpose is to educate developers about open source in general and the Mozilla project specifically.

Good luck!

Answer 3

i worked with mozilla code ( precisely mozilla/nss/security). as far as my understanding of mozilla goes :

It follows layered architecture with NSPR layer (Netscape Portable Runtime ) at the bottom which interacts with Operating Systems.

get the source code from
https://developer.mozilla.org/En/Download_Mozilla_Source_Code and build it in your working environment( as far as i know it support wide variety of platforms/architectures)

join Mozilla developers community/ try to help through testing some of the components.

to code for mozilla, go through : http://www.mozilla.org/hacking/ ( C++ portability standards is a must if you are C++ programmer).

hope some of the above might help you getting started.

Answer 4

Here's a top-down answer (most of the others are bottom-up):

Firefox is a XUL application (see also: XUL); XUL is a variant of XML used to describe a GUI that is interpreted by a renderer, much the same way that HTML is rendered within the browser, but XUL includes the browser's menus, buttons, status bar, keyboard shortcuts, etc. It's pretty neat; I've been able to put together some simple GUI apps much faster in XUL than in other frameworks (and it's platform-independent!).

If you look in the Firefox application directory (wherever you installed it on your system), you'll see a "chrome" directory with a bunch of .jar files. These are just .zip files with a particular structure (including a manifest) and you can look through them yourself.

Much of the Firefox browser is actually XUL + Javascript. It does utilize a lot of lower-level libraries written in C++ and accessible to Javascript via XPCOM, but if you want to understand (& modify) the higher-level behavior, the XUL+Javascript parts are probably the place to start.

edit: p.s. here are some tutorials/references for XUL: 1 2 3 and also the O'Reilly book

edit: XUL documents are very similar to HTML documents (only more so!) in the way they interact with the user + events. There's a document model for dynamically modifying the XUL, and there are event models that have event listeners. Both act just like HTML + DOM + its event model, but with a richer set of builtin objects/interfaces/events/etc. The event handlers are interfaces of a particular sort, and can be implemented by Javascript objects (declared in the XUL with onclick="blah()", or added dynamically through Javascript calls to addEventListener() -- both are exactly the same syntax as HTML events in Firefox) or by C++ or other languages that can implement XPCOM objects with the proper interfaces.