關於網路那些事...

網路行銷,SEO,網路趨勢,教學文章,網頁設計,生活時事

微軟力挺 PWAs ,將其加入 Edge 與 Win10,並列為應用商店一等公民

"漸進式網站應用程式" (PWAs, Progressive Web Apps) 以網頁技術為基礎,能開發出原生APP或AP的特性,在各種設備帶來良好的體驗,不依靠網路的特性、快速加載、安裝、即時更新、推播訊息等等功能


如果你喜歡我們的文章內容,請在這裡按個讚



2018年 網頁設計的趨勢


本文翻譯自 Rohit kumar15 Web Design Trends in 2018 (+1 Bonus) 部分內容是以示意的方式翻寫,若有錯誤或建議,都歡迎提出

如果你是一個設計師,並且正在尋找能啟發靈感的趨勢? 那麼你就來對地方了。

在這裡由 Rohit kumar 所彙整的 15+1 個網頁設計趨勢,希望你會喜歡~


如果你喜歡我們的文章內容,請在這裡按個讚



Node sass 入門 [筆記]

在過去 sass/scss 興起的時期,最常搭配 compass 以及相關的 mixins 來進行開發


如果你喜歡我們的文章內容,請在這裡按個讚



CSS3 動畫 Transition, Animation, Transform 基礎 [筆記]

CSS3 建構過程,時常會需要用到動畫設計,所以就將相關的參數及使用記錄下來,方便之後查詢及使用~

瀏覽器前綴

在使用任何CSS3高級屬性時,建議都要搭配瀏覽器前綴,讓屬性效果可以在各瀏覽器有更好的支援

-moz-{屬性}Firefox 瀏覽器。
-webkit-{屬性}Safari, Chrome, Opera 等瀏覽器。
-o-{屬性} Opera 瀏覽器。
-ms-{屬性} IE 瀏覽器。

Transition

Transition 可以用來設定基礎的動畫效果,直接指定要產生變化的css屬性


如果你喜歡我們的文章內容,請在這裡按個讚



Google Rendertron - 解決 Client side rendering 的SEO問題


如果你喜歡我們的文章內容,請在這裡按個讚



React 元件生命週期 [筆記]

React 為 component (元件)提供了許多生命週期相關的方法

讓我們可以在 component 輸出前,輸出後,或者被消滅等狀態時,可以藉由這些方法來設計一些行為


如果你喜歡我們的文章內容,請在這裡按個讚



React refs 屬性

所謂 Refs 就是官方不建議使用,又非得談的東西

React 典型的數據流是透過 props 在父子 Component (元件) 之間傳遞,

透過更新 props,透過新的 props 來 re-render 子元件


如果你喜歡我們的文章內容,請在這裡按個讚



Javascript Event Loop 介紹

Event Loop 是 Javascript 主線程循環處理任務列隊(task queue)事件的運行機制

Web Event Loop

單線程設計

Javascript 主線程是以單線程的方式設計

在主線程中,包含許多要執行的任務,可以分成同步(synchronous)及非同步(asynchronous)任務,會按照順序處理這些任務

同步的任務比較單純,會遵照上方的規則,在主線程一個一個接續處理

在處理非同步任務時,不會等待非同步結果,就會接續處理後面的任務

例如,我們執行非同步任務,完成發出 ajax (不會等返回結果).., 就會接續處理後面的行程

任務列隊(task queue)與 Event Loop

Javascript 會優先處理主線程的項目,接著才會處理任務列隊(task queue)的項目

並且,讀取任務列隊的行為會不斷的重複,及稱之為 Event Loop

當我們一開始執行非同步任務,或者在後續才觸發的任務,都會被排入任務列隊中

主線程就會不斷地去檢查,並依順序處理這些任務列隊中的項目

Node.js Event Loop

Node.js 由javascript建構,也是單線程的設計


圖 by @BusyRich

  • Node.js 運作流程,會先從 V8 引擎解析應用程式的 javascript 腳本
  • 接著,會調用 Node.js Bindings (Node.js API)
  • 再透過 Libuv libary 執行 Node.js API,將這些任務以非同步方式傳給任務所屬的處理線程,並且持續執行,形成Event Loop
  • 這些非同步任務取得結果後,會將結果返回給 V8 引擎
  • V8再將這些結果傳到客戶端

Node.js 提供了兩個方法 process.nextTick, setImmediate

process.nextTick 可以在主執行線結束之前被執行 (進入下一個Event Loop之前)

setImmediate 可以在目前的任務列隊結束之前被執行

另外,node js 可以透過 Cluster API 來達到多執行緒設計

推薦閱讀 http://www.ruanyifeng.com/blog/2014/10/event-loop.html


如果你喜歡我們的文章內容,請在這裡按個讚



聊 Javascript Prototype 設計特性

在javascript建立的基礎底層,都會透過 prototype (原型鍊) 來設計出許多預設功能


如果你喜歡我們的文章內容,請在這裡按個讚



[Solved] fontFamily 'Arial' is not a system font and has not been loaded ...

In the development of RN process, using react-native-swiper expansion,
When ios preview normal display, but Android has made an error: fontFamily 'Arial' is not a system font and has not been loaded through Expo.Font.loadAsync...

I am using create-react-native-app and Expo
Obviously, the reason for the error is less Arial font


如果你喜歡我們的文章內容,請在這裡按個讚