2015年4月24日 星期五

JAVA script template Using Handlebars.js


1. What is Handlebars.js ?
It is using javascript to process the MVC pattern in view process.

You can Learn start from getting-started-with-handlebars-js
Official site api from Official sites
code From git

2015年4月12日 星期日

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









2015年4月8日 星期三

V8 and NodeJS

1. What are them?

V8 is such as a interpreter and a platform that run javascript code and glue the C++ .

Node.js is framework that provides  the basic API such the buffer. It will be extend to a lot of modules such as network, server and etc.

2. Introduction of V8
Feature:

  • V8 is Google's open source JavaScript engine.
  • V8 implements ECMAScript as specified in ECMA-262.
  • V8 is written in C++ and is used in Google Chrome, the open source browser from Google.
  • V8 can run standalone, or can be embedded into any C++ application.
Download:
      You can download the code from git v8-git-mirror

How-does-a-JavaScript-engine-work:

V8 Component:
  • JS object and compiler
  • Share library
  • Runtime enviroment


3. Introduction of Node.JS
Node js provides many programming API and you can write the js on server side.
Following is the API snip from official site and you cand



















4. Advance topic about Custom your API
This article teach how to design a API using V8 API how-to-roll-out-your-own-javascript-api-with/



REF:
V8 build
How V8 work
google v8

2015年4月6日 星期一

Javascript loop

JavaScript supports different kinds of loops:
  • for - loops through a block of code a number of times
  • for/in - loops through the properties of an object


the for/in used in self defined property;

var person = {fname:"John", lname:"Doe", age:25};
var text = "";
var x;
for (x in person) {
    text += person[x];
}

Javascript function

1. What is it? 


It has Function Expression

//anonymous function expression
var a = function() {
    return 3;
}
a();
 
//self invoking function expression
(function sayHello() {
    alert("hello!");
})();
 


and  Function Declaration
function bar() {
    return 3;
}
 
 
2.  JavaScript Closures
 JavaScript variables can belong to the local or global scope.Private variables can be made possible with closures.
// Inner class
 function add() {
    var counter = 0;
    function plus() {counter += 1;}
    plus();   
    return counter;
}





REF
 W3C 
IF HEMINGWAY WROTE JAVASCrIPT

Javascript - Let description


1. What is it?

The let statement declares a block scope local variable, optionally initializing it to a value. and use in ECMA 5.

2. How to use it



if (x > y) {
  let gamma = 12.7 + y;
  i = gamma * x;
}


3. Compare

I: Local variable
Variables declared within a JavaScript function,
become LOCAL to the function.

Local variables have local scope: They can only be accessed within the function
// Example 



II: Global variable
A variable declared outside a function, becomes GLOBAL

// Example 
var pi = 3.14;
var person = "John Doe";
var answer = 'Yes I am!'




 REF
MSDN