Rendering Path (一) 簡介

渲染路徑簡介Rendering Path 是瀏覽器如何將網頁檔案轉化成網頁的處理路徑，其路徑包含了網路(Network)、HTML、CSS檔案轉化成兩顆獨立樹狀結構、兩顆樹狀結構合併成渲染樹(Render Tree)、版面配置(Layout)、繪製(Paint)，每個路徑之間關係會如同下圖所示那樣，首先會先從網路找到提供網頁的伺服器獲取對應網頁(由HTML、CSS)、當客戶端的瀏覽器一拿到這些檔案

HTML CSS JavaScript
DOM

Inline element VS. Block element

inline element容器會以實際容器所存的內容為主且不會特別佔據沒顯示內容的區塊而將容器特別獨立開來，以此特性會讓該容器能夠與其他容器在同一行內呈現，而inline element就是由此而得名。 特點： 容器的範圍會貼齊實際內容，也就是說容器內並不會出現額外的空白 容器會以內容為主，並不能夠隨意調整高度和寬度 容器在網頁上的呈現並不會在新的一行呈現，會貼齊上個容器後 block el

HTML
DOM

JavaScript - Hoisting簡介

一種預設性的行為，能將所有object和primitive的宣告分別轉移到頂端以優先宣告他們的存在，這功能適用於當使用這些元件時且這些元件的宣告就在之後的程式碼出現，當這個情況出現時便會在使用這些元件的程式碼之前先宣告其元件的存在，而這樣的動作就好像從下方的宣告程式碼搬到到上方來處理，因此得名hoisting，接著宣告完之後便會執行原本的程式碼。 比如以下程式碼看似有宣告先後的問題: 12con

hoisting

JavaScript - Loop 結構

該結構是允許程式碼基於布林值條件式是否成立而給予適當次數的重複處理或者重複執行特定的statement，該結構會由for或while而構成。 for 語法會搭配著變數、判定該變數的條件式、做完一次的後續處理，接著再跳回該變數的條件式來判定是否結束或者繼續做相同的事情。 當系統進入for的開頭時(如下語法)，會先執行assignment，然後再處理condition的部分，若為true時，便會進入f

JavaScript
loop

JavaScript - Switch 使用方式

根據switch包含的表達式(expression)最後得出的結果(result)來挑選以下case來做處理，其挑選方式類似於Goto和label，但不一定真是使用這兩個語法：每個case會類似於label那樣，只是告訴系統要跳到哪裡，而挑選這些case的處理會告訴系統如何透過對應的結果和類似goto的語法來跳躍至指定的case。 下面是switch的基本語法架構，switch括號內部是存放對應結

switch

(施工中)Introduction: Floyd Cycle Detection

當你想解決任何一個需要檢測在多個相互連接的元素是否存在著循環結構之場景，比如說 道路模型。 由多個有限狀態所組成的數學模型。 有限輸入下在同一個函式所形成的結果，比如集合為，且以及，在這裏1和2就透過函式關係形成一個循環結構。 我們可以將這些場景轉化成由多個節點構成的List結構，並且大致區分為兩種不同結構： 擁有循環結構的List結構 沒擁有循環結構的List結構 當我們轉換成如此的結

Algorithm
Floyd Cycle Detection Cycle Detection