

Why everyone should use Safari for rich web development - ahoyhere
http://mir.aculo.us/2009/07/09/why-i-use-safari-for-development/

======
halo
I don't really find these arguments compelling.

Using the Acid3 test in this context is misleading. Acid3 tests a random
selection features to ensure they work corrrectly. In this case, Firefox 3.5
fails on 7 of the tests and 5 of these are due to SMIL (pretty much SVG
animation) and SVG fonts. They are obscure features, and don't provide a
compelling reason to choose Safari over Firefox, least of all for development
where you won't be able to use those features in the real world until other
browsers implement them. Whatsmore, in designing Acid3, Hixie deliberately
picked on browser bugs so the test didn't favour one vendor, irrespective of
how they effect the real world - taking a single number out of context and
point at that to prove the innate superiority of one browser over another, or
that one browser follows "better standards", is incredibly simplistic, let
along drawing conclusions that sites will be easier to port because of it. At
worst, all it could tell you is that one vendor is focusing on passing a test
and another isn't.

I don't really see the pre-optimisation as a real-world issue, and I seriously
doubt bugs creep in through it. It feels very much like somebody making a
problem out of nothing.

All projects have long niggles and bugs that have been there since the dawn of
time. The fact that Firefox has bugs spanning years is more of a sign that the
Mozilla project has been around for years than inehrent tardiness.

I also don't really understand the conclusion that "OS X is the only system
that allows me to test all major browsers side-by-side by means of
virtualization software". In actuality, if testing is your priority, then
Windows would probably be the platform of choice as it's the only platform
that can run all the major browsers (IE6, IE7, IE8, Firefox, Safari and
Chrome) natively. Linux can also virtualise all the browsers not available
natively through virtualisation of Windows, no different from Mac OS X.

~~~
jonbwhite
Arguably, the only reason why OSX could be considered the only system that
test via virtualization is that Apple makes it illegal to virtualize OSX in
the first place.

~~~
costan
I believe the license says you have to run OSX on Apple-labeled hardware. So
as long as you use a Mac Pro / Macbook... :)

~~~
rue
Or have an Apple label...

------
ruddzw
"Basically, if some HTML/CSS works on Safari, the chances are very high it
will work on Firefox 2 and higher, and on IE 6 and higher (with minor
tweaks)."

I don't get it. A lot of the hardship that comes with web development is that
stuff that works great in modern standards-based browsers like Safari doesn't
work when you try to view it in IE. I can't count the number of times I've
taken a webpage that I developed to work in Safari (or Firefox) and seen it
break completely in IE. And it often takes more than "minor tweaks" to fix it.

~~~
arohner
I'm new to web development, and I keep asking this question but I've never
heard and answer to it:

What's stopping us from making a tool that parses HTML/CSS and points out
constructs that are known to be bad in certain browsers? Sort of like lint:
"It looks like you're sending element foo inside element bar to IE6. This
probably won't work right"

I personally don't have a windows box to test IE, and I'm not looking forward
to the day when I'll have to test on IE. Surely there is a better solution
than manually testing browsers?

~~~
chaosmachine
I suspect this kind of thing is a lot harder than it sounds.

There are a few things you could catch, like CSS features that just don't
exist in IE6, but trying to predict if your particular mix of content+HTML+CSS
is going to "look wrong" when viewed in IE is not a trivial problem.

------
robotron
Except that Safari has not been released for the operating system that I do
web development under. So no.

~~~
trezor
According to the author that just means that you are using the wrong OS for
web development, because despite how the world wide web is supposed to be
platform independent, there is only one OS for web development</sarcasm>.

Besides a few profiling tools, his list of arguments seems to boil down to
"things are prettier in Safari". Maybe it's just me, but that's really not my
number one feature when looking at development tools.

~~~
zimbabwe
Safari's available for Windows and the Mac. That means that 99% of computer
users can use Safari.

Since when was "things are prettier" a bad thing? I do extensive Windows
testing using browsers, and Safari's rendering engine is leagues ahead of
everything else, its developments tools are more polished than Firebug and
easier to figure out, and it's one of only two browsers that fully supports
HTML 5. Firefox renders things shittily (even on the Mac, which has possibly
the best rendering engine out there _available for all apps by default_ , it
fails Acid 3 at the moment, and while Firebug's great for some things, at
other things it fails hard.

~~~
mpk
"Safari's available for Windows and the Mac. That means that 99% of computer
users can use Safari."

Firefox is available for Linux, OSX and Windows. It's open-source to boot and
is available in different builds and brands for different systems.

That means that 100% of developers can use Firefox, regardless of the OS they
choose to run.

~~~
zimbabwe
If I develop in a single OS, it doesn't matter to me where else my browser's
available. So if I design things without using Linux, Safari's sufficient, and
there's no disadvantage to my using it.

Two browsers can each be good without one rendering the other entirely
useless. Safari's development environment is in many ways better than
Firefox's, so why not use it when you've got it (which is 99% of the time)?

~~~
rbanffy
I spend less than 99% of my time under either Windows and OSX. In fact, it's a
pain to work in an environment without proper software management (and no,
macports and Fink are not enough, at least not for me)

------
rgrieselhuber
I've recently switched to Safari as well, for a very simple reason. Firefox
performance was just too bad to deal with any longer. The combination of nutso
RAM / CPU it took was bringing everything else on my machine to a slow crawl.

------
m0th87
I'm developing a web service that spits out json. I dropped Safari immediately
because it automatically downloads anything that is application/json, whereas
Firefox will display it and syntax highlight it with the JSONView plugin
[[http://ajaxian.com/archives/jsonview-json-browser-from-
withi...](http://ajaxian.com/archives/jsonview-json-browser-from-within-
firefox)].

Despite the great improvements Safari has made with respect to its developer
tools, it can't top Firefox's amazing third-party plugin selection.

------
Maciek416
I really want to use Safari for debugging but every time I get down to trying
to do so, I find some irritating hangup in terms of clunkiness and polish
versus Firebug, and I end up heading right back to Firebug. Two things off the
top of my head:

1) console output is just _not_ as good as Firebug. Example: try going on
jquery.com and doing console.log($("p")). Instead of a pretty printed array
with styled items as in Firebug in the form of <p>, with all their classes and
ids and visibility status hinted in the rendering, you get an expandable
HTMLParagraphElement object (and its name doesn't even respond to a click..).
If you expand that, the first thing you see is a big list of DOM constants
like DOCUMENT_FRAGMENT_NODE: 11, etc. In Firebug these are sorted, filtered,
censored to fit to the way web developers actually work.

2) I've never been able to resize the Console/Debugger when displayed as a
split pane in the Windows version. In OS X, it seems to work, but in Windows,
nothing. Again, a huge irritant when you're trying to get a better look at
something that's gone wrong.

Nit picks? Yes. But some of us work with these things many hours a day.
Workflow issues and missing little details like these prevent my uptake of the
otherwise very impressive developer tools in Safari.

~~~
jpcx01
I totally agree. These small issues have also caused me to drop Safari dev
tools in favor of Firebug.

------
beamso
I use both Safari and Firefox for my web development. Safari's web inspector
has a nicer user interface for javascript debugging, but Firebug has better
support for editing CSS on the fly.

~~~
ROFISH
It took me awhile to figure this out, but if you double click on the element
styling you want to add additional CSS to (for example, the right column shows
#content p has "color:#bbb;", double click on the "color:#bbb" part), add
semicolons and the new style after the old one. (with the example the single
line textbox should have "color:#bbb;padding:2em;") It'll correctly parse and
add the new styling.

------
lpgauth
My only complaint is that the dev tools gives colors in rgb instead of hex.

~~~
willwagner
The RGB thing also drives me completely crazy to the point that I have started
muttering obscenities under my breath like a mad man every time I see one.

~~~
boucher
I cannot, for the life of me, understand why anyone would want to specify a
color in hex.

~~~
nuclear_eclipse
Because that's the way CSS/HTML works?

~~~
olliej
CSS and html both support rgb(), rgba(), hsl(), and hsla() colors in addition
to hex...

~~~
boucher
Do most browsers actually support hsl/hsla? Never actually paid attention to
that. Would certainly be nice... though I've already put the conversion code
in CP.

------
chewbranca
I recently switched from firefox 3.0 to safari 4 beta when it first came out,
and then back to firefox 3.5.

Originally I switched to safari 4 beta because I'm on a machine that has
limited ram and firefox 3.0 would buckle my system. Safari 4 is slick and runs
much lighter and faster than firefox 3, however firefox 3.5 really levels the
playing field and makes the comparison about features rather than resource
consumption.

When you compare the two on features, safari is lacking. While safari has
clean tools built in for web development, they are more for looking at a page
rather than messing around with it. I find it a pain to go and change styles
or elements in safari and also you can't delete elements out of the dom in
safari which I find very annoying. Firebug is not as polished looking, but it
definitely has the best set of features. Also firefox's extensive set of
plugins is tough to live without.

I enjoyed my time with Safari, it was a very elegant polished experience, but
web hacking is rarely both, which is where firefox and its plugins feature set
really shines.

------
Devils-Avacado
Do Safari's developer tools allow you to change CSS and HTML on the fly like
Firebug?

~~~
jpcx01
Almost. You can edit CSS styles, but not add new ones. You can add attributes
(style=) to elements. It's been extremely clunky for me, but I have hope it'll
be smoothed out in the future.

------
jpcx01
I like Safari's dev tools, but its missing some really basic stuff that
Firebug makes easy.

In Firebug, you can double click on anything in the dom view and edit it. In
the CSS view, you can easily add new attributes. The autocomplete for CSS
styles is awesome.

Also, you can grab any asset file (css, js) and open it up in your default
text editor.

Safari 4 web dev tools isnt quite there. It only needs a few tweaks, but they
don't seem to be adding them anytime soon (people have been asking for these
features for about a year now).

------
zmimon
I know I risk getting downmodded to oblivion, but the developer tools in IE8
have actually brought me back to using IE for development some of the time.
There are some specific features that are very handy - the debugger is awesome
- better than the one in firebug. The CSS tracing features are even better
than FireFox's for some specific situations. I now probably spend about 20% of
my time in IE when developing pages (as opposed to almost never except for one
off checking prior to IE8).

------
jonursenbach
In addition to using Safari for rich web development, I assume we should all
be using Textmate and working on our Macbooks in dimly lit coffee shops.

Give me a break. Use whatever you want to use for web development. As long as
whatever you're doing works across _all_ A Grade browsers, I could care less
what you use.

------
pkulak
The only thing Firebug has over Safari is adding styles to a page. That's
pretty huge when you are trying to get something to look right without 4
million page reloads. It's only one thing, but it's pretty huge.

------
rbanffy
Is it my impression or this is one more of those "Why I do X and why everybody
should do it too because if they don't they are doing it completely wrong"
posts?

------
dtf
OS X is the only system that can run a virtualized IE?

------
edw519
OK, maybe I'm stupid or slow, but there's something I just don't get about
"browser wars".

Exactly where does it say that HTML, CSS, & Javascript has to be source code?
If browser differences cause you so much grief, why don't you just treat
whatever goes out to the client as "object code" of your own engine.

That engine would have to create a different page for each browser that you
decided to support. Sure, it would be 4 times the work for every page, but
that's work done by your engine, not you. Browser differences are accomodated
through maintenance to your engine, not every page or library.

IE is not going away any time soon, so your output better be able to handle
it's DOM. While you're at it, take a look at your user's resolution as well,
and serve it the way they want to see it, not what you decided is best. No one
likes horizontal scrolling or white space on the edges.

~~~
zimbabwe
That's an interesting idea. The problem with it is that it takes a very long
time and, depending on the OS being used to develop, would be a pain to work
with. I'd have to be in Windows constantly to test the IE pages as I built
them, and since there are 3 separate Internet Explorers I'd probably have to
build 3 separate pages. If you combine both browser usage and resolution
detection, suddenly I've got to make a dozen pages for every page on my web
site, which is time consuming and not exactly a comprehensive approach either.

This approach works for the iPhone, which is standardized completely, but not
for the complex and varying desktop browser scene.

------
keefe
linux port? (:

------
GrandMasterBirt
Micro-Optimizations are bad? That is just a load of shit.

If you can prove that Firefox's optimizations actually make incorrect results
in any way, I am 100% behind whoever claims that micro optimizations are bad.
However by firefox making them it means that I don't have to worry about the
nitty gritty details about what order of instructions will perform better
without changing the code. Or things like loop unrolling that don't have to be
done in my checked in source.

Yea I think this argument is about 30 years too late...

If anything this proves FF3 is awesome.

Regarding web standards... As much as I am 100% for having good web standards,
what good is adhering to a standard when no one can use it. I use the acid
tests as an indication that browser x, y and z are browsers I want to be
supporting. Unfortunately I always have to support IE... Sometimes even IE6,
so acid tests are just nice-to-haves at this point. I just can't wait till IE7
completely dies (hopefully it won't be as long as IE6).

~~~
ahoyhere
> However by firefox making them it means that I don't have to worry about the
> nitty gritty details about what order of instructions will perform better
> without changing the code

Actually, Firefox benefits the most from tweaks like this, because its engine
is so slow. For whatever reason. That's why I thought this post was
interesting!

~~~
GrandMasterBirt
A good point. If the FF engine is so slow it needs this, then the engine needs
help.

However I see no reason why you should not be able to indicate to firefox that
for this page do not optimize the javascript, then vuala good debugging. The
only catch is that the optimizations need to be proven to be correct in all
cases.

Once we have Safari for Linux I will consider using it as the main browser...

Scratch that, once at work we officially support it ill consider it :)

------
OmarIsmail
The whole "This is the best thing EVAR!" articles really need to die.

In general the "best" tool is whatever one is best for the current job.
Fortunately in the Webdev world our tools are free and easily accessible.

I personally use Safari, Chrome, Firebug AND IE8 (seriously, the built-in
developer tools are actually decent!). Usually I start with Firebug, and if I
run into a small issue instead of wasting time trying to fix the tool in that
case I just try another tool. Usually one of the tools will handle the case
with no problems and I can continue debugging/developing my core project
instead of debugging the tool.

