@前端

動態 列表
@gqkmiss

ChromeOS 134 版本更新

ChromeOS 134 版本更新 一、ChromeOS 134 更新內容 1. ChromeOS 自助終端(Kiosk)模式支持隔離 Web 應用(Isolated Web Apps) 從 ChromeOS 134 開始,自助終端(Kiosk)模式支持 隔離 Web 應用(Isolated Web Apps,IWA),提供 更安全、更強大 的應用解決方案,並可 深度集成系統功能。 1.1. 主要

gqkmiss 頭像

@gqkmiss

昵稱 月恆

@gqkmiss

Chrome 133 版本開發者工具(DevTools)更新內容

Chrome 133 版本開發者工具(DevTools)更新內容 一、持久化的 AI 聊天記錄 AI 助手面板會在本地持久化聊天記錄,即使重新加載 DevTools 或 Chrome,也可以查看之前與 Gemini 的對話內容。 二、Performance 面板改進 此版本為 Performance 面板帶來了多項改進。 1. 圖像交付洞察 Performance Insights 選項卡可以

gqkmiss 頭像

@gqkmiss

昵稱 月恆

@gqkmiss

Chrome 134 版本開發者工具(DevTools)更新內容

Chrome 134 版本開發者工具(DevTools)更新內容 一、隱私與安全面板 舊的 Security 面板已演變為隱私與安全面板,並新增了一個專注於隱私的部分。在該部分中,可以: 在 DevTools 打開時,臨時限制第三方 Cookie(可帶或不帶例外),並測試網站在此情況下的表現。 查看一張表格,其中包含有關第三方 Cookie 的信息,包括它們是否被臨時限制模式攔截或豁免,以及

gqkmiss 頭像

@gqkmiss

昵稱 月恆

@gqkmiss

Chrome 135 版本瀏覽器更新

Chrome 135 版本新特性 一、Chrome 135 版本瀏覽器更新 1. 第三方託管賬户註冊遷移到 OIDC 授權碼流程 Chrome 135 將賬户註冊的登錄頁面從營銷網站遷移到動態網站,同時也將 OpenID Connect (OIDC) 的隱式流程遷移到授權碼流程。這樣做的目的是進一步提升第三方託管賬户的安全性和用户體驗。 2. iOS 版 Chrome 的下載內容自動刪除 iOS

gqkmiss 頭像

@gqkmiss

昵稱 月恆

@gqkmiss

Chrome 135 版本開發者工具(DevTools)更新內容

Chrome 135 版本開發者工具(DevTools)更新內容 一、性能(font style="color:rgb(32, 33, 36);"Performance/font)面板改進 1. 性能面板中的配置文件和函數調用現已顯示來源和腳本鏈接 Performance Summary(性能 概覽)選項卡現在會顯示配置分析(profile)和函數調用相關的腳本及來源鏈接,這樣就不需要再將鼠標

gqkmiss 頭像

@gqkmiss

昵稱 月恆

@fenanjiu

亞像素渲染:瀏覽器如何處理小數像素的渲染?

前言 最近遇到一個這樣的問題,在一些機型上的loading轉圈動畫看起來有點抖,轉起來像個橢圓,心想會不會是這個icon寬高不同造成的,但看了一眼代碼裏面寬高寫的是一樣,按理來説這個loading應該是一個正圓,旋轉起來不應該抖才是的。 比如這樣: div class="w-20px h-20px border-rd-50% loading"/div 寬高相等的一個正圓,旋轉起來看着怪怪的。事實

fenanjiu 頭像

@fenanjiu

昵稱 南玖

@fenanjiu

瀏覽器如何確定最終的CSS屬性值?解析計算優先級與規則

前言 上篇文章中有提到CSS值的處理過程,但如果想要確定一個元素的最終樣式值可以不需要這麼多步。實際上我們寫的任何一個標籤元素無論寫沒寫樣式,它都會有一套完整的樣式。理解這一點非常重要‼️ 比如:一個簡單的p標籤 打開瀏覽器控制枱,選中元素,切換到computed選項,勾選show all,這裏就能夠看到元素的所有CSS樣式,儘管你什麼樣式也沒寫,它們也是有默認值的。任何標籤都是這樣,只不過默認

fenanjiu 頭像

@fenanjiu

昵稱 南玖

@fenanjiu

通過performance面板驗證瀏覽器資源加載與渲染機制

前言 一個網頁的核心由HTML、CSS和JavaScript組成,三者協同工作以呈現內容並實現交互。但瀏覽器如何解析這些資源?加載順序如何影響用户體驗?讀完本本文你將徹底弄懂以下核心知識 為什麼需要生成DOM樹? CSS是否會阻塞HTML解析?是否阻塞頁面渲染? JavaScript是否會阻塞HTML解析? JavaScript的異步加載機制如何影響解析過程? 如何通過performa

fenanjiu 頭像

@fenanjiu

昵稱 南玖

@fenanjiu

Safari 隱私模式下,URL 參數為何神秘消失?

前言 最近在排查Safari在隱私模式下頁面參數丟失的問題,如果通過Safari直接打開B頁面,此時在B頁面可以正常獲取到頁面鏈接上的參數,但是如果Safari先打開A頁面,然後通過A頁面再跳轉到B頁面(A、B頁面部署在不同域名下),此時的B頁面通過JS就獲取不到鏈接上的參數了🤔,這樣就會導致一些依賴頁面參數的功能出現異常! 問題演示 B頁面鏈接格式如下:xx.qq.com?au=xx... 通

fenanjiu 頭像

@fenanjiu

昵稱 南玖

@dewujishu

基於瀏覽器擴展 API Mock 工具開發探索|得物技術

一、前 言 在日常開發過程中,偶爾會遇到後端接口未完成或者某個環境出現問題需要根據接口返回來複現等等場景。剛好最近在學習瀏覽器插件的相關知識,並在此背景下開發了一款基於瀏覽器插件的 Mock 工具。該工具專注於 API請求攔截和數據模擬,旨在幫助開發者提升開發效率,能夠解決一些問題。 二、瀏覽器插件介紹 什麼是瀏覽器插件 瀏覽器插件(Extensions 或 Add-ons)是一類運行於瀏覽器進程

dewujishu 頭像

@dewujishu

昵稱 得物技術

@writers

SEE Conf 2025:開啓體驗科技的新十年

『We believe 產品體驗的提升能助⼒業務增⻓』SEE Conf 2019 · 《科技與⼈⽂結合的體驗度量》 『一切精彩才剛剛開始,體驗科技大會,今年是第三屆,我相信至少能持續舉辦三十屆。現在參會主體是八零後、九零後,期待二十多年後,體驗科技大會裏,不僅依舊能看見八零後、九零後和零零後,還能看見大量一零後和二零後。』SEE Conf 2020 · 《體驗科技和好的產品》 『我們認為,

writers 頭像

@writers

昵稱 思否編輯部

@beckyyyy

給web增加簡單的ai對話功能

自從 ChatGPT 火了之後,越來越多人開始對 AI 感興趣,AI 的使用也越來越普遍了。現在你隨便點開個知名網站或者 APP,基本都能看到 AI 的影子,而且這些 AI 大多都是用 “問答” 的形式跟人互動,説白了就是 “聊天”。 當然啦,現在的 AI 也不是完美的,比如有時候會瞎編東西(就是大家説的 “AI 幻覺”),但給 APP 加個 AI 功能,確實能讓它變好玩、互動感更強。那咱們

beckyyyy 頭像

@beckyyyy

昵稱 beckyyyy

@codesheep_pro

當了leader才發現,大廠最想裁掉的,不是上班總遲到的,也不是下班搞失聯的,而是經常把這3句話掛在嘴邊的

“當了 leader 才發現,公司最想裁掉的,不是上班總遲到的,也不是下班搞失聯的,而是經常把這 3 句話掛在嘴邊的” 這是最近在職場社區裏又被聊熱起來的一個老話題。 作為一個在職場上混跡了近 9 年的程序員,一路走來親眼目睹和經歷了程序員職場裏的各種風雨。從一開始的大頭兵到後來負責一個獨立的小團隊,從一個所謂的 leader 的視角上來看問題,對這個事情的理解似乎又有了一些變化。 在我剛成為小團

codesheep_pro 頭像

@codesheep_pro

昵稱 CodeSheep

@yaochujiadetiebanshao

一套系統,覆蓋體育+電競全場景——熊貓比分平台全新亮相

在實時比分賽況日益成為用户關注焦點的今天,一款既穩定又具擴展性的“全場景數據系統”正在成為眾多體育、電競平台的剛需。今天,我們正式發佈全新版本的 熊貓比分平台 —— 一套覆蓋體育+電競全場景、可高效部署、可快速二開的“實時數據解決方案”。 🎯 為什麼開發熊貓比分平台? 我們服務過超過300+體育數據相關項目,深知行業痛點: 多數據源接入繁瑣,不同接口結構不統一 傳統系統僅支持足球/籃球,電

@dianliangxiaocheng_19854189632

構建新型電力系統:點量雲流解鎖智慧電網數字孿生新價值

近年來,國家圍繞電力系統轉型與能源數字化發展,連續出台多項綱領性文件。國家發改委、國家能源局在《關於加快推進能源數字化智能化發展的若干意見》中明確提出,要推動電力系統與雲計算、大數據、物聯網、人工智能等新興技術深度融合,加快構建覆蓋電網發、輸、變、配、用全環節的數字孿生體系,強化全景監測、智能預警與精準控制能力。與此同時,《“十四五”現代能源體系規劃》與“構建新型電力系統”戰略部署進一步突出數字化

dianliangxiaocheng_19854189632 頭像

@dianliangxiaocheng_19854189632

昵稱 點量實時雲渲染

@gqkmiss

JS Navigator.sendBeacon 可靠的、異步地向服務器發送數據

JS Navigator.sendBeacon 可靠的、異步地向服務器發送數據 前言 我們在上一篇頁面訪問頁面關閉數據上報的文章中使用了 sendBeacon 方法用來發送數據,上篇文章是簡單使用,那本篇文章我們就詳細瞭解下這個東西。 一、Navigator.sendBeacon 是什麼能做什麼? Navigator.sendBeacon 是一個用於發送少量數據到服務器的 API,尤其適用於在頁面

gqkmiss 頭像

@gqkmiss

昵稱 月恆

@huobaodejianpan

深入淺出: XML HttpRequest 入門指南

XML HttpRequest(XHR) 技術是構建動態、響應式網站的關鍵。這項技術使得網頁能在不重新加載整個頁面的情況下與服務器進行數據交互,極大地優化了用户的交互體驗。 定義 XML HttpRequest XML HttpRequest 是一種瀏覽器與服務器進行數據交換的 API。儘管它的名字包含 “XML”,XHR 實際上支持多種數據格式,如 JSON、HTML 和純文本等。初期,它主要用

huobaodejianpan 頭像

@huobaodejianpan

昵稱 火爆的鍵盤

@renzhongdaoyuan_59170ca258c53

封裝 uniapp 請求庫的最佳實踐

背景 在前端開發中,HTTP 請求是與服務器進行數據交互的核心手段。無論是獲取數據還是提交數據,前端應用幾乎都離不開 HTTP 請求。在 uniapp 中,uni.request 是官方提供的用於發起 HTTP 請求的基礎 API。然而,直接使用 uni.request 存在一些問題和不足,比如: 代碼冗餘:每次發起請求時都需要編寫類似的配置代碼,導致代碼重複。 缺乏統一管理:沒有統一的地方

@xingfudenaozhong

AJAX是如何憑一己之力提高前端程序員的工資水平的?

作者:阿達西 鏈接:juejin.cn/post/7395396352183009290 emmm,今天無意間聽到一個比較奇怪的信息,就是在很早之前,前端工程師只是一個切圖崽,而且工資也不是很高。説白了,就是沒含金量的工作。因為那時候的Web應用相對簡單,主要關注於頁面的靜態內容和基本的交互。所以前端開發的工作主要集中在HTML、CSS和基礎的JavaScript上。 但是自從AJAX出現後

xingfudenaozhong 頭像

@xingfudenaozhong

昵稱 幸福的鬧鐘

@jianer

無感刷新token解決方案

在你的 axios 封裝文件中,你需要兩個外部變量來管理狀態: // 標記是否正在刷新 token 的“鎖” let isRefreshing = false; // 存儲因 token 失效而掛起的請求的“隊列” let requestQueue = []; 請求攔截器 (Request Interceptor) 它的任務很簡單:在每個請求發出去之前,都帶上當前的 token

jianer 頭像

@jianer

昵稱 健兒

@jianer

從一個請求封裝的“死循環”Bug,我學到了什麼?—— 深入剖析 async/await 與錯誤處理 前言:那個讓我頭疼的下午

我們都曾經歷過這樣的下午:一個看似邏輯嚴密的模塊,在實際運行時卻表現得像個失控的野獸。我的故事,就從一個本應“智能”處理登錄和 Token 刷新的 ajax 請求封裝函數開始。 我希望它能在接口返回 400(需要登錄)或 4_01(Token 失效)時,自動完成登錄或刷新 Token,然後再重新發起剛才失敗的請求。然而,它卻在某些情況下陷入了可怕的無限循環,瘋狂轟炸着我的服務器。 起初

jianer 頭像

@jianer

昵稱 健兒

@silkide

前端數據拷貝簡史

本來是自己想了解下js中關於零拷貝的內容,順藤摸瓜瞭解了下相關歷史演進,便有了這篇文章。雖説是數據拷貝歷,但其中也夾雜了大量關於Ajax和SPA的歷史,也算是順着拷貝這條藤摸到的瓜,所以有點跑題。希望大家能開心吃瓜,如果有任何紕漏和補充,請在評論區暢所欲言,我們一起完善這段有趣的歷史。 一、為什麼我們需要拷貝? 小明已經有了一個羅技G102鼠標,但是他又買了一個,請問為什麼?答:因為怕第一個壞掉了

silkide 頭像

@silkide

昵稱 Silkide