iT邦幫忙

chrome相關文章
共有 98 則文章
鐵人賽 自我挑戰組 DAY 17

技術 [蛻變事實/D17] 設計師勇闖前端城-(必備工具4:利用Chrome 幫你練功找壞蟲)

不管網頁設計師或前端工程師,使用Chrome做為網頁開發已是基本工具 未免有人不知道如何使用,又或者一直只用些基礎功能者想加強功具 可以參考一則六角在Udemy...

鐵人賽 Modern Web DAY 7

技術 Chrome Canary(Chrome 金絲雀版)

Chrome Canary 網站連結:https://www.google.com/chrome/canary/ 進入網站後就可以根據自己的電腦系統下載,金絲雀...

鐵人賽 Modern Web DAY 7

達標好文 技術 10 個好用的 Chrome 插件(上)

又來到工欲善其事,必先利其器的時間~ 今天要來介紹針對開發 10 個好用的 Chrome 插件,使用這些插件有什麼好處呢? 可以快速且清楚了解其他網站使用哪些...

技術 Google Chrome ERR_SSL_SERVER_CERT_BAD_FORMAT

Google Chrome ERR_SSL_SERVER_CERT_BAD_FORMAT 如下圖 這個網站無法提供安全連線 https://www.ublink...

鐵人賽 Modern Web DAY 1

達標好文 技術 Postman - 測試 API 神器 1/2

在我們最近舉辦 The F2E - 前端修練精神時光屋的各種活動中,經常都會釋出 API 提供給大家在開發網頁時,可以更有彈性的使用這些資料,而在釋出這些 AP...

達標好文 技術 chrome 插件 #1 : ezLinkPreview (不用開新分頁瀏覽新的網頁連結)

使用方式: 1.只要是有href、link的網頁元素 會在右上角顯示EZ圖案 2.滑鼠點選它,就可以不用開新頁面下瀏覽網頁 :-) 連結: ezLinkP...

技術 怎麼把「滾動條」隱藏?

問題釐清 什麼是「滾動條」? 滾動條指的是下圖右側被紅線框起來的部分: 只要網頁內容大於視窗,滾動條就會出現。 一般來說,只要不是body層次的滾動條,那用o...

鐵人賽 Modern Web DAY 26

技術 GTM 26 - 番外篇 - 如何實作 Openseach 於網站中,在 Chrome 輸入網址後按 Tab 就可以直接搜尋網站內容

GTM 社團 如果網站有實作站內搜尋的話,如何加上 Opensearch,讓各瀏覽器可以加入自己網站的搜尋引擎,ex:在 Chrome 輸入網址後按 Tab...

鐵人賽 Modern Web DAY 30
認識 Chrome 開發者工具 系列 第 30

技術 寫在最後

今天是鐵人賽的最後一天,本來這一天也是要寫技術內容,不過後來想想還是來寫參賽的心得好了XD 其實這並不是我第一次參加鐵人賽,去年我也有報名並且也有發文,雖然只發...

鐵人賽 Modern Web DAY 29
認識 Chrome 開發者工具 系列 第 29

技術 使用效能面版來檢測記憶體洩漏

今天算是正式文章的最後一篇 (明天要發完賽感言XD),在鐵人賽一開始的時候,我本來想規劃幾天的時間來跟大家一起來討論效能面版 (Performance pane...

鐵人賽 Modern Web DAY 28
認識 Chrome 開發者工具 系列 第 28

技術 記憶體面版 - 記憶體分配分析器

今天我們要介紹的工具是記憶體面版中的最後一個工具: Record Allocation Profiler,這個工具可以讓我們按函數來檢視說那些函數佔用了許多記憶...

鐵人賽 Modern Web DAY 27
認識 Chrome 開發者工具 系列 第 27

技術 記憶體面版 - 記憶體分配時間線

今天我們要透過記憶體面版的另一個工具來檢測記憶體洩漏的這個問題,先來看一下今天我們要用來檢測的程式: 今天的測試程式範例一樣來自官方文件,而我也把範例程式放到...

鐵人賽 Modern Web DAY 26
認識 Chrome 開發者工具 系列 第 26

技術 記憶體面版 - 記憶體堆快照 2

昨天我們一起看了一段官方文件裡提供的程式,它會產生分離的 DOM 節點,這些節點不會被垃圾回收 (Garbage Collection) 所以會造成記憶體洩漏。...

鐵人賽 Modern Web DAY 25
認識 Chrome 開發者工具 系列 第 25

技術 記憶體面版 - 記憶體堆快照 1

今天我們要開始一起來討論記憶體面版 (Memory panel),這個面版的主要功能就是讓你做網站的記憶體體檢,像是記憶體洩漏、記憶體膨脹和頻繁的垃圾回收都可以...

鐵人賽 Modern Web DAY 24
認識 Chrome 開發者工具 系列 第 24

技術 審查面版

我們在前面有簡單介紹了審查面版(Audits panel),它可以幫我們檢測我們的網站是不是有遵循最佳實踐 (Best practices),並提供我們每個問題...

鐵人賽 Modern Web DAY 23
認識 Chrome 開發者工具 系列 第 23

技術 網路面版 - 了解每個請求

經過這幾天的介紹,我想大家對這個面版已經有一定的認識了,但是我們其實還沒有進到每個 HTTP 請求裡面,去查看這個請求細節,而這就是我們今天要做的。好,就讓我們...

鐵人賽 Modern Web DAY 22
認識 Chrome 開發者工具 系列 第 22

技術 網路面版 - HTTP 請求列表

今天我們要來看 HTTP 請求列表的欄位所代表的意義 HTTP 請求列表 請先打開開發者工具並切換到網路面版,然後重新載入畫面一次。這時候你的 HTTP 請求列...

鐵人賽 Modern Web DAY 21
認識 Chrome 開發者工具 系列 第 21

技術 網路面版 - 總覽

昨天我們介紹了網路面版的介面,也一起看部份 HTTP 請求列表的功能 (Request row),今天我們要一起來討論總覽 (overview)。 但在開始之前...

鐵人賽 Modern Web DAY 20
認識 Chrome 開發者工具 系列 第 20

技術 網路面版 - 介面簡介

今天要一起來看的是網路面版 (Network panel),網路面版主是要拿來檢查資源透過 HTTP 傳輸的狀況。當我們的瀏覽器向網頁伺服器發出要求直到伺服器把...

鐵人賽 Modern Web DAY 19
認識 Chrome 開發者工具 系列 第 19

技術 原始碼面版 - 找到那個 Bug

今天我們要把 JS 除錯控制台 裡的功能講完,然後再介紹在中斷點作用中的時候,我們如何使用控制台 (Console) 來快速除錯。 使用 JS 除錯控制台 在開...

鐵人賽 Modern Web DAY 18
認識 Chrome 開發者工具 系列 第 18

技術 原始碼面版 - 在中斷點間移動及觀察變數

到目前為止,我們已經知道怎麼在開發工具裡設置中斷點,也一起討論了兩種設置中斷點的方法跟它們的差異。今天我們要介紹更多除錯的小技巧,準備好了嗎? 使用 JS 除錯...

鐵人賽 Modern Web DAY 17
認識 Chrome 開發者工具 系列 第 17

技術 原始碼面版 - 使用中斷點 2

昨天我們中斷點講到了一半,今天我們就接著一起來看在中斷點作用後,我們可以做些什麼。 使用中斷點來除錯 請重覆昨天的步驟,並使用官方的 Demo 來打開中斷點,如...

鐵人賽 Modern Web DAY 16
認識 Chrome 開發者工具 系列 第 16

技術 原始碼面版 - 使用中斷點 1

今天我們要開始來一起討論如何使用原始碼面版 (Sources panel) 來除錯你的網頁。在開發者工具中,我最常用的面版就是元素面版跟原始碼面版,每當我在進行...

鐵人賽 Modern Web DAY 15
認識 Chrome 開發者工具 系列 第 15

技術 應用面版

在 HTML5 的標準裡面,加入了很多以前所沒有的前端儲存方式像是 Local and session storage, IndexedDB 等等。而 Chro...

鐵人賽 Modern Web DAY 14
認識 Chrome 開發者工具 系列 第 14

技術 行動裝置工具欄

因著現在行動裝置的流行,還有響應式網頁設計 (Responsive Web Design, RWD) 在這幾年成為設計網站流程中重要的一環,Chrome 開發者...

鐵人賽 Modern Web DAY 13
認識 Chrome 開發者工具 系列 第 13

技術 控制台面版 2 - 結合元素面版

昨天我們簡單的介紹了控制台面版的讀取-求值-輸出循環功能,今天我們要一起要來看它提供的一些方便的 API,以及如何透過這些 API 與元素面版一起使用。 常見...

鐵人賽 Modern Web DAY 12
認識 Chrome 開發者工具 系列 第 12

技術 控制台面版 1 - 讀取-求值-輸出循環

今天我們要一起來討論的 Chrome 開發者工具的控制台面版 (Console panel),這個面版我們在前面有很簡單的介紹過,其實它就像是一個讀取-求值-輸...

鐵人賽 Modern Web DAY 11
認識 Chrome 開發者工具 系列 第 11

技術 運算及其他的幾個控制台

過去的幾天,我們一起討論了如何動態編輯 DOM 元素及樣式,這就是元素面版最常用的兩個功能,而今天要跟大家一起來探討的是在元素面版中剩下的幾個控制台,而這當中除...

鐵人賽 Modern Web DAY 10
認識 Chrome 開發者工具 系列 第 10

技術 元素面版 - 動態編輯樣式

昨天我們花了一點時間看了如何使用樣式控制台 (Styles pane) 來檢視樣式,今天我們則要來看如何動態編輯樣式。 再次提醒大家,我們在元素面版裡的編輯都...

技術 防火牆如何封鎖阻擋 Chrome 遠端桌面

有攻有守 才有攻守道 XD FQDN封鎖 chromoting-host.talkgadget.google.com 或是關閉 port 5222 回應就可以了...