Abstract How browser work

This is a abstract content from how browsers work

Main structure

User interface 
   this includes the address bar, back/forward button, bookmarking menu etc.
 
Browser engine
   the interface for querying and manipulating the rendering engine.
 
Rendering engine
responsible for displaying the requested content. For example if the requested content is HTML, it is responsible for parsing the HTML and CSS and displaying the parsed content on the screen.

Networking
 used for network calls, like HTTP requests. It has platform independent interface and underneath implementations for each platform.

UI backend 
 used for drawing basic widgets like combo boxes and windows. It exposes a generic interface that is not platform specific. Underneath it uses the operating system user interface methods.

JavaScript interpreter. 
Used to parse and execute the JavaScript code.

Data storage.
his is a persistence layer. The browser needs to save all sorts of data on the hard disk, for examples, cookies.

The main flow

I Parse STEP

1. Parse HTML  to DOM tree

2. Parse CSS to css tree

3. Parse javascript.

• javascript will execute when it encounter and this the html may be not all in standby.

II Build the Render tree

A render tree will combine the DOM NODE and CSS attribution

III  Layout 

Layout is output content the width and height in the screen, and show the color etc. The viewport mean the browser default position

IE9 compatible mode

Problem:

 When you written in web page, if you have some CSS3 code, but the 
 IE9 browser open page using the quirk mode, and you will miss the your style,
 how do you setting the IE9 browser to standard mode??

Solution:

(a)  Before html, you can type the doctype
     <!DOCTYPE html>

(b)  in <head> </head> tag, adding the

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">



Reference:
DOCTYPE & Quirks Mode
Internet Explorer 9 (IE9) 的相容性檢視

Unicode and 全形字元 在 html

1. What is Unicode HTML ?

when you type the other nature characte, you can use unicode in html

2. How to use ?

you type a set of &#AABB;  in this AABB is the unice code number, and &#; is the encolse around the char.

3. Example

，  is the , symbol

Reference:

關於 HTML Unicode 轉換

全形和半形

URI

JAVA Code:
URI destURI = destPhyPath.toURI();
//gsiftp://vl04.grid.sinica.edu.tw/storage/euasia/55068857b8ccaf0f8538b419cd3e94d7/609b46ac/-d5e5-4c/20-9248-/9a3ca3c5/9477/c7aa41/86-8e5/7-4521/-8bd4-/43adb0/aa2eb3

String destHost = destURI.getHost();// remote
// host:vl04.grid.sinica.edu.tw

int destPort = ((destURI.getPort() == -1) ? 2811 : destURI.getPort());

String destPath = destURI.getPath();// remote
// path:/storage/euasia/55068857b8ccaf0f8538b419cd3e94d7/609b46ac/-d5e5-4c/20-9248-/9a3ca3c5/9477/c7aa41/86-8e5/7-4521/-8bd4-/43adb0/aa2eb3

FaceBook

1. 申請帳號: register your Facebook application.

2. 同意後,
應用程式 ID 103871759660058
API 金鑰 1c00525a36d8a201192d447927f6f06c 你公開的 API 金鑰。
秘密 ecbe6ca4855c667ff7ba8de9c460e3e7

3. 下載 facebook api 在 local 端.
取得 [Andy@t-ap188 MY_DIR]$ ls
facebookapi_php5_restlib.php facebook_mobile.php facebook.php 檔案

4, 建立應用程式: 在 local /MY_DIR/
index.php
{{{
// Copyright 2007 Facebook Corp. All Rights Reserved.
//
// Application: Example
// File: 'index.php'
// This is a sample skeleton for your application.
//

require_once 'facebook.php';

$appapikey = '0fb83bc6c1301371176a6bd1a05fbfb8';
$appsecret = 'b620c0cd71b8e1044534b50c90208a97';
$facebook = new Facebook($appapikey, $appsecret);
$user_id = $facebook->require_login();

// Greet the currently logged-in user!
echo "

Hello Hello, !

";

// Print out at most 25 of the logged-in user's friends,
// using the friends.get API method
echo "

Friends:";
$friends = $facebook->api_client->friends_get();
$friends = array_slice($friends, 0, 25);
foreach ($friends as $friend) {
echo "
$friend";
}
echo "

";

?>

}}}

}}}

5. 設定畫布 Canvas
1. 畫布頁面網址
http://apps.facebook.com/andyfacebookexample/
2. Canvas Callback URL -> http://140.109.98.188/MY_DIR/


6. 可以留覽應用程式

Reference:
1. http://developers.facebook.com/docs/guides/canvas/


Note:
1. 重點應該在 friend 應用
2. callback 作什麼呢??

JQuery

1. 在 SL linux 下已建立 http /var/www

2. 可放 jquer program in this
[Andy@t-ap188 html]$ ls alert.html index.html jquery-1.4.2.js

3. vim html.index
{{{






}}}

4. 起動 http: service httpd start

5. SELinux -> Boolean -> HTTPD Service -> Disable SELinux protection for httped dameon