Rendering a Browser Window

[guest]

Hi,

I am just wondering if anyone knows how IE and Netscape render the webpages, for example, do they keep one huge DC that has the window already rendered and then when the window is scrolled they just display the apprpriate part or do they render each part everytime the user scrolls the window.

I want to create a program that does something similar to IE and Netscape in that it takes a page definition (like HTML) and draws a window however I am at a loss because if I was to keep one huge DC it would litterally get HUGE!!!

Does anyone have any ideas??

thanks.

[Tim]

If you use the ScrollWindow function to scroll the window, Windows will BitBlt what's already there and call InvalidateRect for the part that's just been exposed. Your window will receive a WM_PAINT, and you can look at the rectangle inside the PAINTSTRUCT structure for the area which needs re-rendering.

[Guest]

So I have to determine everytime what part needs to be drawn, wouldn't this take alot of time and cause some kind of flicker or something??

thanks for your help.

[Tim]

In your WM_PAINT handler you can find out the rectangle that needs painting (i.e. the rectangle that was passed to InvalidateRect). You can either paint everything, or just paint the things in the invalid rectangle. The option you use depends on whether it's easier to work out where something should be on screen, or just paint it anyway.

Since you're writing a web browser, I'd say it's pretty easy to determine the location of an element without actually drawing it, so for a big web page, using this approach should be a lot faster. Hint: use

Code: Select all

IntersectRect(&temp, &element->rect, &ps.rcPaint);

and look at the return value to detect whether a certain element is inside the invalid rectangle.

[Guest]

That sounds good, I give it a go.

Thanks for your help Tim.

[ark]

it wouldn't be necessary to keep the whole page on a DC in memory, only enough to redraw what's on the screen and then blt it to the display.

when it comes to scrolling the window, you only have a couple of options -- you can use the ScrollWindow function and paint the part of the webpage that's just come into view, you can repaint the entire display directly to the display on every scroll (and get bad flickering), or you can repaint on a back buffer and blt on every scroll. there isn't too much else you can do.

[ark]

BTW, it's not lengthy drawing time that causes flickering, it's erasing the background before drawing that causes it. lengthy drawing time will, however, cause the program to respond to the user sluggishly, which is definitely not good.

[mystran]

Not that I've ever written such an application, but if I did, I'd try this at first:

If you are rendering HTML, I'd suggest that you take a look at CSS box model (check CSS2 specs at w3.org) which should give you some insights.

Basicly I'd parse the document tree, then create a "box" tree of all the elements (using either hardcoded or supplied stylesheets) and then use that to determine what needs to be read.

You need to get widths and heights of things like images and a block of text, but once you have an internal data-structure of the layout as boxes, it should be easy enough to do the actual drawing based on that structure.

It seems to me, that if your layout is based on the CSS box model, you can add CSS support quite easily, and if no stylesheet is available, use a set of default values.

Just my ?0.05