WebKit DemoBrowser

Published Wednesday March 5th, 2008
40 Comments on WebKit DemoBrowser
Posted in Internet, Qt, WebKit

In 4.4 Qt is getting a new module, qtwebkit. I have been watching it develop over the past year and have been eager to play around with it in Qt. Shortly after the module was merged into the main Qt branch I began working on a small browser in my spare time. Something I could use for at least some of my daily browsing. By eating my own dogfood I could catch errors in WebKit, the new networking code, and especially spot trouble areas in the API before the release.

*Disclaimer: This is just a little demo project of mine, not a FireFox replacement.*

Startup speed
One nice feature of Qt4 over Qt3 is the startup speed. I have seen reviews of KDE4 that even mention the nice bump that KDE applications received, even application have have just been porting and no extra refactoring was done. When Zack was first working on the webkit Qt integration I noticed that his test application would launch near instantaneous when Qt was in memory already. So if WebKit can launch fast, and Qt can launch fast I was definitely going to make sure that some silly demo code didn’t make it launch slow. So even with an icon database, history, cookies, tabs, etc the demo can still launches quickly. So I think it is fast enough.

Networking
In 4.4 there are some new networking class built up around the new QNetworkAccessManager class. Check out Thiago’s recent blog entry One more piece falling into place: Network Access for some more information about all the new goodies included with it. On top of networking classes I created some gui components including a minimal download manager with the usual suspects such as a progress bar, download speed, etc. A nice little demo for the download manager in its own right. Something new that QNetworkAccessManager uses that not mentioned before is the QCookieJar that is included with Qt4. Wrapping it I added saving/loading, and the usual web browser features.

User Agent
Once the browser was in good enough shape to be use every day I setup Gnome and KDE to choose the demo browser as my preferred browser. So anytime I clicked on links from e-mail or from #qt on irc the demo browser would be used and in the server logs a new user agent would show up for the mysterious demobrowser/0.1. The default qtwebkit user-agent is constructed from QCoreApplication::applicationName and the new QCoreApplication::applicationVersion properties. So if you integrate QtWebKit in your application it will automatically include the application name and version in the user-agent. This is of course configurable. Because it is just a demo and for simplicity sake the demo behaves like a single application, when launched it will contact the already running browser and tell it to open the url from the command line arguments if there is one (configurable to open in new window or tab of course).

Session Managment
Developing the demo I knew that I typically leave my browser open for days at a time and loosing your open tabs (or anything really) in a crash is never good. Also while developing the demo I would want to quickly restart it as changes were made. With that in mind the demo contains is a little watch dog class that makes sure that at most you will only loose the up to the last three seconds in the event of a crash. Not just tabs, but history, cookies, and everything else is protected. Restarting the browser selecting History/Restore Last session will quickly re-open all the top level windows and their tabs from last time.

x-qt-plugin
QtWebKit include a plugin framework and QWebPage has extra built in support for one specific plugin type, x-qt-plugin which the demobrowser implements (see QWebPage::createPlugin) The demo browser lets you add any Qt widget into the webpage. Just like with QScript, signals, slots, properties are all fully accessible from JavaScript. You could even embed QWebView and make a browser in the browser if you wanted to. With the demo browser if you load up a webpage with the following code you will find a loading QProgressbar.



More than for a browser
Already there have been Qt developers blogging about their interesting QtWebKit projects such as Amarok and KDE Plasmoids. I am looking forward to see what everyone does with QtWebKit.

FAQ:
The demo can be found in the demos/browser directory of the Qt package. The browser in the 4.4 snapshots has more then the beta including proxy configuration, in page search, improved keyboard shortcuts and some of the features mentioned here.

  • This is only a demo, I tried to not do anything that couldn’t be done with Qt easily, so adding bunzip, tar, and bittorrent support to the download manager wasn’t on my todo. There are plenty of neat things to do first such as bookmarks.
  • Although plugin support was added to QtWebKit for 4.4, the official Adobe flash plugin support will have to wait for 4.5. Or more to the point the netscape plugin support wont be added until 4.5
  • gmail currently does not work.
  • There are no known crashes so please report any that you find.
  • I plan on continuing to develop this demo, for example I have bookmarks mostly done in a branch and am am working on adding more autotests before merging.
  • Many cookie issues can be worked around by turning on “Accept All Cookies” in the preference, the cookiejar has a few fixes that are not in yet.
  • Feel free to check out the code for the demo. The total size is quiet small and I tried to keep the code clean.

A blog about a browser is only complete with a screenshot so here it is running on Windows (Vista), Linux (Gnome), and OS X (Tiger)
demobrowser.png
Having a cross platform browser who’s code base is small and completely open kicks ass.

A big thanks to Jen, Jens, Holger, Morten, Thiago, Simon, Jesper, Thomas, Paul, and everyone else who gave feedback/patches.

Do you like this? Share it
Share on LinkedInGoogle+Share on FacebookTweet about this on Twitter

Posted in Internet, Qt, WebKit

40 comments

David says:

Is it possible to create instance of QProcess with x-qt-plugin?

Benjamin Meyer says:

The demo browser’s code implementation just does the following:


QUiLoader loader;
return loader.createWidget(classId, view());

So you can get widgets (QComboBox, QProgressBar, etc). It was meant to be just a taste of what you could do with the plugins. When embedding QWebView in your application you can of course support any classId including QProcess.

Richard Moore says:

Sounds like you could extend the widget loading code to allow you to load a .ui file from the server quite easily. That would let you do some much cooler stuff with it. ๐Ÿ™‚

Siro says:

This is so amazing. I already looked at the “browser” when the Qt 4.4 beta was release a couple of days ago and really liked it.
The “browser” could really evolve to something that could be used instead of Firefox, Konqueror, Opera or Safari.
Maybe you should consider (if TT has no problems with it) to move the browser to an independend svn/git repository so external developers could contribute to the code without big trouble. It wouldn’t be that nice to fork your code while you still work on the “TT-branch”. Imagine to have a real full fledged nice Qt 4.4 based browser when Qt 4.4 is released (or shortly after).

Keep up the really great work you do!

David says:

Isn’t it a possible exploit?

Benjamin Meyer says:

@David: sure if you actually expose QProcess in your application then it would be an easy exploit.

Benjamin Meyer says:

@Siro I have talked with several others about putting it on labs or spawning off a project on sourceforge or somewhere. Essentially somewhere were it can take on a life of its own and other developers can contribute easier. Up until now most of the development has been about trying to push the QtWebKit API. Finding weaknesses, missing features, bugs, and functionality that when I tried to implement I discovered that I just couldn’t. So at least until 4.4.0 is released it will stay in Qt. After that we will see where it should go. I do already have a git repo with autotests and examples for many of the classes which I will put up shortly. Besides, before it can get a project it needs a name. ๐Ÿ™‚ Any suggestions?

Martin says:

@Benjamin: As for the name: What about Sextant or Octant? Really cool navigational tools!

* http://en.wikipedia.org/wiki/Sextant
* http://en.wikipedia.org/wiki/Octant_%28instrument%29

Browser name: QuesT.

Yeah, I used grep -i ‘.*q.*t.*’ /usr/share/dict/words . There’s a couple of other possibilities. banQueT, eloQuenT, QuainT (heh), ubiQuiTy, and sQuinT aren’t too bad either. I like QuesT the best though; it shares the best capitalization with QuainT, is one letter shorter, and is a pretty decent browser name.

Sts says:

Seeing the tab widget in different styles side by side: why on earth is the Mac QTabWidget so ugly? I have never seen such tabs in any Mac application, and was hoping Qt 4.4 would improve the look finally.

David Johnson says:

I see the same style tabs in on my Mac (10.4 Tiger) in several applications. It looks consistant to me. What isn’t consistant is the ‘+’ button on the left. Here’s a link showing some historical Mac styles. The current looks is near the bottom. http://www.appleinsider.com/print.php?id=3343

MamiyaOtaru says:

Quest does strike me as a great name. I wouldn’t bother capitalizing the T though; for looks, and because the t isn’t capitalized in Qt anyway.

Ryan Graham says:

I agree, Quest would be a great name for a QtWebkit browser.

I wonder how this demo browser would do on the Acid3 test… (http://acid3.acidtests.org/)

anonymous says:

I can’t wait to test it on my old P3! I certainly hope its startup is snappy. If Qt4+QtWebkit is truly lightweight then this browser will fill up an important place in the browser market.

Oh, and PLEASE don’t bloat it with features…

LudoA says:

I agree, Quest sounds nice.

@anon: without features, there won’t be any users. Unless you mean putting the features in extensions, with that I’d definitely agree.

It’d be great if there was some common interface for extensions, so they’d be cross-browser. Or at least if they could be easily portable, but AFAIK that’s not the case, as FF’s extensions use XUL, and other browsers (unfortunately) don’t support XUL (though with XULrunner, that might become easier to accomplish – I’d love to see XUL-support become more widely available, it’s an easy & fun way to make RIA’s).

(PS: this is a really hard-to-read captcha, and there seems to be no accessible alternative. It’d be great if you’d use akismet instead, and even greater if OpenID was supported.)

I’ve done a build (using VC Express) of the latest nightly after reading this post; I thought I’d upload it in case anyone wanted to check it out.

I was hugely excited after trying the latest Safari; it is noticably faster for me than Firefox and the idea of having another awesome, fast open source competitor in the Windows browser world is awesome.

Anyone that wants to check out the current browser build can nab it from here: http://trog.qgl.org/20080306/webkit-browser-for-windows/

Hmm, I posted this before but it got eaten (maybe I screwed up the security code). Please delete if I end up duping.

I’ve been following the development of Windows-based WebKit browsers since I discovered how fast Safari 3 was; I’m dead keen to have another open source browser on the market.

For those (like me) that want to check out the development progress of this Qt demo browser, I’ve done a build of the latest daily snapshot – you can nab it right here:

http://trog.qgl.org/20080306/webkit-browser-for-windows/

pd says:

I am sick of the terrible lengths web developers have to go to in order to allow users to edit text in a reasonable manner. textarea tags should have been replaced by texteditor tags a decade ago.

The ability to write Qt plugins that can run inside the demo browser you mention sounds like it could provide me with the ability to write a demo solution for modernising textarea tags. Does this sound possible to you?

Marius says:

@Ryan: I just ran all the acid tests. Unfortunately, it stops at 39 on Acid3 ๐Ÿ™
@LudoA: We’re using Akisment as well, and _still_ get spam we have to handle. PS: There’s no captcha for registered users ๐Ÿ™‚

Acid test result:

Vanya says:

To clarify my muddled mind: it’s possible to write a browser using qtwebkit that can run the flash plugin, but qtwebkit won’t accept the plugin itself? Flash is possible in a Qt4.4 webkit browser?

Thiago Macieira says:

We have not written yet for loading and running Netscape plugins in WebKit. So it’s not possible to load Adobe Flash into the stock QtWebKit. That doesn’t mean Flash and other plugins aren’t possible. There are alternatives:

1) you could write your own nsplugin loader if you can’t wait for ours
2) you can use a different Flash plugin than Adobe’s (one of the open source ones that could be modified to fit into QtWebKit)

Peter says:

Hi,
I just gave your browser a try on an embedded Linux board. Build was static, -qt-libjpeg is defined (plus the other image formats). It doesn’t show any pictures on my device? Is this a bug with the current beta? Qtopia does link the plugins into the application when building statically?

miniak says:

Hi,
it is great to have a (X)HTML rendering engine in Qt, I was really looking forward for this feature,
however after playing a little with the demo browser application, I was quite disappointed by
1) the performance, which is really poor compared to Firefox & Opera for example. scrolling is really slow (using Athlon XP 2600+ @ 2 GHz, 1.5 GB RAM, Windows XP SP2).
2) some images on regular webpages just don’t load, a blue placeholder icon is shown instead, reloading the page doesn’t help
3) pages have broken layout – this is probably a problem with the pages themselves, have to check them with Safari 3

Frรฉdรฉric COIFFIER says:

Hi,
I’m trying the demo browser but I can’t find how to define an HTTP proxy.
I’ve tried the QNetworkProxy::setApplicationProxy() but it doesn’t work. I also tried page()->networkAccessManager()->setProxy() before loading an URL but it doesn’t more work…
Is there a quick way to do that ?

Frรฉdรฉric COIFFIER says:

Hmm… sorry…

“The browser in the 4.4 snapshots has more then the beta including proxy configuration”

I’m going to try this snapshot !

Craig Ringer says:

Impressive. I’m posting this from DemoBrowser. For a few-days-old app, even based on mature libraries and tools, it’s really rather impressive. The inspector was particularly unexpected and amazing.

I did notice that:

– Many images aren’t displayed, including 8-bit RGB JPEG images with embedded colour profiles and GIF images.
– the Home and End keys don’t work for page navigation (start/end of page)
– It tries to be single-instance-per-user but doesn’t do messaging like foregrounding the window or opening a new blank window/tab when another copy is launched.

Benjamin Meyer says:

@Craig Ringer: What pages are not showing images for you? I just checked a few animated gif sights and didn’t have any problem viewing them. I have a patch for the Home/End keys that i’ll get in tomorrow. As for single instance it will call raise and activate, but that is up to the window manager to decide what to do, I noticed that Gnome likes to just have it blink on the task bar, where were you running it? Lastly it will only open a new tab/window if a url is passed otherwise it just does the raise/activate action.

@miniak Not sure which one you tried with, hopefully the beta for the scrolling performance in the snapshots is much better then the beta. Also which pages don’t have images loading for you?

Craig Ringer says:

Sorry, I didn’t provide much useful information, despite often being on the receiving end of such reports myself.

I was testing with the build referenced by David Harrison (above) on Windows Vista. It’s entirely possible that the image issues are related to that build’s Qt configuration. I had issues with images on the majority of sites, including http://www.postnewspapers.com.au/ (yes, I know the HTML is horrifying).

I’ll have to check out the snapshot and try it out; I need to test my code with the new Qt snapshots anyway.

Sverre says:

I just tried the compiled snapshot that was posted in an earlier comment and I have to say I am impressed. This browser has real potential. Just do me a big favor: Don’t bloat it up with any stupid random features like some of the other browsers. I want a lightweight browser that doesn’t feel sluggish (like the UI in firefox or IE or safari for windows) or impossible to navigate through the interface (like opera), or doesn’t leak hundreds of megabytes of memory after a few hours use. To survive in the browser wars today the browser should find its own niche instead of copying the others…this one could be to be lightweight since there are NO good lightweight browsers out there imho ๐Ÿ™

Of course I will not use a experimental browser as my primary, but I have to say I was pretty damn close.

One note though: A lot of images could not be displayed. Furthermore, flash would be appreciated although I do my best to avoid such sites ๐Ÿ˜›

Sverre says:

One more thing by the way. The address field seems to update for each of the files downloaded by the browser. For instance on a news site the address field is updated for each image or js library downloaded as they are being downloaded. Thus leaving the last file downloaded as the site address. Shouldn’t this be in the statusbar?

As an example: “www.aftenposten.no” left “http://impno.tradedoubler.com/imp?type(iframe)g(17098600)a(50596)” in the addressfield. Tradedoubler would earn a lot of cash by me copy-pasting cool url’s to my friends ๐Ÿ˜›

Craig Ringer says:

I notice significant RAM consumption growth on Vista with the build posted above. It was up to 50 MB after viewing about 10-15 pages. This could be a caching effect, but the fact that the growth rate doesn’t seem to fall off argues against that.

miniak says:

I noticed the performance problem in 4.4.0 beta1 build and also in some earlier nightly version.
I haven’t tried the latest snapshot yet, as it takes quite a long time to compile the whole Qt on my machine.
The problem with images not being displayed can be seen for e.g. on http://www.cnn.com/

Zan Dobersek says:

Safari is currently scoring 90/100 on the Acid tests, using WebKit as well. But this can probably be blamed upon the version of WebKit used by Safari compared to the version used in Qt’s webkit module. I downloaded WebKit today and built it via Qt port, as described at http://trac.webkit.org/projects/webkit/wiki/BuildingQtOnLinux. Running the Acid tests showed, that the second test result has minor defects , while the results of the third are at 87/100. But still, sites that are not passing the markup validation, like youtube.com for instance, are not displayed correctly. And, of course, the images problems, which cause the app to crash.

Therefor, incorrect rendering of a layout engine, that scores 90+/100 on the Acid test, is most likely not the engine’s fault, but the fault of the web developer and his ignorance to the standards.

The whole WebKit has a beautiful future, especially when you see companies like Google and Apple stepping out to back it up.

As with this DemoBrowser, it, at the moment, totally depends on WebKit’s performance, but don’t stop pushing it – as said, WebKit will eventually get to that 100/100 mark and get running stability with no crashes.

Benjamin Meyer says:

@Sverre the line edit showing every url that is loaded has been improved so it should only show the initial url that was clicked on now.

shamaz says:

uh, I tried the version provided in this blog : http://trog.qgl.org/20080306/webkit-browser-for-windows/
I’m behind an anonymous http proxy and it can’t connect :(.
Firefox works well with the same configuration…
Anyway, I hope you’ll be able to make it become a stand-alone and powerful browser ๐Ÿ™‚ (QuesT is indeed a good name)
good luck

miniak says:

@Benjamin Meyer

so I tried the latest snapshot today and the scrolling performance is no way better than in beta1
and the issue with images not being loaded even occured on this blog post

Benjamin Meyer says:

@miniak: Thanks for the follow up, i will make a note to see if scrolling can’t be improved. I have noticed that occasionally gif images are not showing up for me, but both times it was due to qt issues and a rebuilt of Qt fixed it. Next time it happens i’ll try to track down the issue.

Cepera says:

Thanks for great work.
I have one question.
I built Qt4.4-beta1 on Windows XP SP2 using MinGW and https addresses doesn’t work in browser.
While browser from same Qt version built on Linux works fine with https addresses.
How I can configure Qt to turn https on?

miniak says:

the problem with images not being loaded was my stupid mistake, which I realized later…
I had GIF support disabled in Qt configuration.

Cepera says:

Looks like to turn on https OpenSSL should be installed on Windows.
And Qt should be configured with -openssl-linked option.

If images on web pages doesn’t work – it means imageformats not configured properly or plugins didn’t copied into target release directory.
Qt may be configured with build-in support of image formats: -qt-libpng -qt-libjpeg -qt-libtiff -qt-gif -qt-libmng

Commenting closed.

Get started today with Qt Download now