原创 『中高級前端面試』之終極知識點

作者:陳大魚頭github:KRISACHANChrome瀏覽器進程在資源不足的設備上,將服務合併到瀏覽器進程中瀏覽器主進程負責瀏覽器界面顯示各個頁面的管理,創建以及銷燬將渲染進程的結果繪製到用戶界面上網絡資源管理GPU進程用於3D渲染繪製

原创 面試官:你可以用純 CSS 判斷鼠標進入的方向嗎?

作者:陳大魚頭github:KRISACHAN前言在之前某一個前端技術羣裏,有一個羣友說他面試的時候遇到了一個問題,就是面試官讓他用純 CSS 來實現一個根據鼠標移動位置覺得物體移動方向的 DEMO。給出的初始結構如下:<style>bod

原创 【適合收藏】讓你減少加班的15條高效JS技巧!

作者:陳大魚頭github:KRISACHAN魚頭辛苦總結的15條非常高效的JS技巧,掌握這15個JS技巧,讓你減少加班次數,多抽出點時間來陪女(男)朋友。正文延遲函數delayconstdelay=ms=>newPromise((reso

原创 二營長,快掏個CSS出來給我畫個井字棋遊戲

作者:陳大魚頭github:KRISACHAN前言不知道大家小時候有沒有玩過一款遊戲叫『井字棋』的。它長這樣:(我贏了,快誇我 ~o(´^`)o)上面的就是本次文章的最終結果,一個用純CSS實現的AI井字棋遊戲,Mmmm,雖然看起來有點蠢。

原创 JavaScript實現指定數量的併發限制

作者:陳大魚頭首發地址: https://github.com/KRISACHAN/ying-study/issues說明:魚頭的學習記錄正文在網上看到這麼一道題:這道題跟魚頭這篇記錄『什麼是時間分片(Time Slicing)?』有點相似

原创 5 個提升你 JS 編碼水平的實例

作者:陳大魚頭github:KRISACHAN雖然 2020 的今天,各種前端框架、工具林立,而這些框架跟工具也幫我們提前解決了不少麻煩的問題,但是工具始終是工具,紮實的基本功纔是最核心的,現在一起來通過幾個實際的代碼片段來提高我們原生 J

原创 什麼是時間分片(Time Slicing)?

作者:陳大魚頭github:KRISACHAN根據W3C性能小組的介紹,超過50ms的任務就是長任務。圖片來自使用 RAIL 模型評估性能根據上圖我們可以知道,當延遲超過100ms,用戶就會察覺到輕微的延遲。所以爲了避免這種情況,我們可以使

原创 忍法,scroll 翻滾之術!

作者:陳大魚頭github:KRISACHAN前言在日常的開發中,我們對scroll這個單詞肯定不陌生。例如因爲看不慣瀏覽器默認樣式而用 JS 一頓猛如虎操作的自定義滾動條。或者是嗖~一下就到頂的回到頂部。又或者是想去哪點哪的標題導航。但是

原创 從ES6到ES10的新特性萬字大總結(不得不收藏)

從ES6到ES10的新特性萬字大總結(不得不收藏)作者:陳大魚頭github:KRISACHAN介紹ECMAScript是一種由Ecma國際(前身爲歐洲計算機製造商協會)在標準ECMA-262中定義的腳本語言規範。這種語言在萬維網上應用廣泛

原创 Web開發中最該知道卻從不重視的 —— Accessibility

作者:陳大魚頭github:KRISACHAN什麼是Accessibility?圖片來自WHAT DOES A11Y EVEN MEAN?Accessibility,通常縮寫爲A11Y,這縮寫取的是首字母 + 中間字母長度 + 結尾字母,譯

原创 像監聽頁面一樣監聽戈多的動態

作者:陳大魚頭github:KRISACHAN不知道各位童鞋有木有看過《等待戈多》這部出名的荒誕戲劇 。其劇情大概就是 戈戈 與 狄狄 等待 戈多 的過程中發生的一些瑣事,一共兩幕。等了這麼多年,也不知道 戈多 現在在哪,赴約了沒有。如果

原创 我的 Input框 不可能這麼可愛

作者:陳大魚頭github:KRISACHAN<input />標籤是我們日常開發中非常常見的替換元素了,但是最近在刷whattwg跟MDN的時候發現 跟<input />有很多相關的屬性,選擇器都沒怎麼用過,所以就開篇文章來整理一下一些比

原创 前端進階必備 — 手撕排序算法

作者:陳大魚頭github:https://github.com/KRISACHAN算法是什麼?算法(Algorithm)已經是一個老生常談的概念了,最早來自於數學領域。算法(Algorithm)代表着用系統的方法描述解決問題的策略機制,可

原创 【Hello CSS】第四章-HTML的標籤與語意

作者:陳大魚頭github:KRISACHAN上一篇分享了CSS的邏輯屬性與盒子模型中分享了一些有關設備屏幕的知識以及瀏覽器視口的座標構成。本篇則會分享HTML相關的一些知識。我們在序章的開頭就簡單的講解了HTML的誕生歷史,本篇不作詳細講

原创 【Hello CSS】第九章-如何畫一個體驗更好的動畫?

作者:陳大魚頭github:KRISACHAN在上一節中,不走心地畫了一些CSS圖案,本節就繼續不走心地畫動畫。CSS的動畫屬性在CSS中,animation、transition跟transform使我們常用於製作動畫的屬性,我們先來大致