tag 前端

標籤
貢獻1,041
1115
06:37 AM · Oct 27 ,2025

@前端 / 博客 RSS 訂閱

溪抱魚 - React-native的新架構

本文總結: 文章主要介紹了 React Native 的新架構,包括以下幾個方面的內容:📱✨ 如何抹平 iOS 和 Android 樣式差異,提升跨平台一致性; 分析了舊架構中存在的問題,如通信瓶頸、啓動慢、維護複雜等; 介紹了 JSI 中間層 帶來的變革,如: 不再強依賴 JavaScriptCore 引擎; 可直接在 JS 層調用 Native 方法,提升交互效率; 講解了 R

react-native , 前端

收藏 評論

vivo互聯網技術 - 純前端實現圖片偽3D視差效果

作者:vivo 互聯網前端團隊- Su Ning 本文通過depth-anything獲取圖片的深度圖,同時基於pixi.js,通過着色器編程,實現了通過深度圖驅動的偽3D效果。該方案支持鼠標/手勢與手機陀螺儀雙模式交互,在保證性能的同時,為不同終端用户提供沉浸式的視覺體驗。 本文提供配套演示代碼,可下載體驗: Github | vivo-parallax 一、引言 在當今的網頁設計與交互

pixi.js , webgl , 前端

收藏 評論

溪抱魚 - Next的Seo實踐

第10章:Next的Seo實踐 1. Meta標籤 Next App Router比較主流的有兩種定義源數據標籤的方式,一種是通過在佈局或者頁面上導出一個 metadata 的對象,會自動生成對應的Meta源數據標籤,這是靜態的。 而另外一種則是動態生成meta標籤,這種場景通常需要先請求接口得到一些信息的動態源數據頁面,在這種情況下我們採用generateMetadata函數。 1.1. 靜態M

next , seo , typescript , 前端

收藏 評論

zcf0508 - unplugin-https-reverse-proxy 2.0 發佈:革新移動端調試體驗

大家好!我是 unplugin-https-reverse-proxy​ 的作者。去年,我曾分享如何利用這一工具解決本地前端開發中的鑑權難題,讓開發者能在本地開發服務器上使用測試環境域名輕鬆調試需要登錄態的應用。通過搭建中間搭理服務器,unplugin-https-reverse-proxy​ 消除了手動複製 cookie 和修改 host 的繁瑣步驟,顯著提升了團隊協作開發的效率。 點擊閲讀 提

vite , 前端

收藏 評論

CodePencil - CSS專題之層疊上下文

前言 石匠敲擊石頭的第 15 次 在平常開發的時候,有時候會遇到使用 z-index 調整元素層級沒有效果的情況,究其原因還是因為對層疊上下文不太瞭解,看了網上很多前輩的文章,決定打算寫一篇文章來梳理一下,如果哪裏寫的有問題歡迎指出,不勝感激。 什麼是層疊上下文 層疊上下文(Stacking Context)是 HTML 中的三維概念,它決定了元素在 Z 軸(垂直於電腦屏幕的方向) 上的顯示順序。

css3 , Css , HTML , 前端 , html5

收藏 評論

發怒的洋葱_1NZqF - 大模型開源開發全景與趨勢解讀

「根據 OpenDigger 的數據顯示,人工智能已經於 2023 年超越雲原生,成為協作影響力最大的技術領域」從近十年來 AI、雲原生、數據庫、前端、操作系統這五大技術領域的發展曲線來看,AI 類項目在近些年得到了快速發展,尤其在 2022 年後發展迅猛。AI 項目影響力總值在 2017 年超越前端技術,2022 年後進入快車道,並且在 2023 年超越了已經在逐漸下降的雲原生領域,成為影響力最

bootstrap , 前端

收藏 評論

CodePencil - CSS專題之水平垂直居中

前言 石匠敲擊石頭的第 16 次 在日常開發中,經常會遇到水平垂直居中的佈局,雖然現在基本上都用 Flex 可以輕鬆實現,但是在某些無法使用 Flex 的情況下,又應該如何讓元素水平垂直居中呢?這也是一道面試的必考題,所以打算寫一篇文章來好好梳理一下,如果哪裏寫的有問題歡迎指出,不勝感激。 分類 實現元素水平垂直居中的方法有很多,大致可以分為以下兩類: 固定寬高元素適用的方法 不固定寬高元素

css3 , Css , HTML , 前端 , html5

收藏 評論

Aion - React Router V7 路由守衞

React Router V7 本身並沒有直接提供內置的路由守衞 API(比如 Vue Router 的 beforeEach),但通過組合其提供的鈎子(如 useNavigate、useLocation)和 React 的組件設計模式,我們可以實現類似的功能,比如權限控制、登錄驗證、數據預加載等場景。 路由守衞 路由守衞是指在路由切換時執行一些邏輯,以決定是否允許導航到目標路由。 常見的場景包括

react , react-native , 前端 , Javascript

收藏 評論

兔子先森 - css元素高度佔滿餘下空間

div class="box" div class="box1"/div div class="box2" div style="height: 500px;border: 1px solid gold;" /div /div /div 在css中,div的寬度默認獨佔一行,而高度需要手動設置。 上面的佈局,box 高度 300 box1的高度未

react , vue.js , css3 , 前端 , Javascript

收藏 評論

zhishaofei3 - 京東零售招前端·亦莊

京東零售招前端·亦莊 國際部門 要求 熟悉 react 加分項: next.js C端業務 聯繫 emhpc2hhb2ZlaUBqZC5jb20= (base64)

招聘 , 面試 , 前端 , Javascript

收藏 評論

兔子先森 - 解決移動端設備hover樣式不消失問題

下面是一段scss示例: .btn-text { border: 1px solid #cfd5de; transition: all 0.3s; @media (hover: hover) { :hover { color: #006eff; border-color: #006eff; } } :active { col

react , vue.js , css3 , 前端 , Javascript

收藏 評論

孟文平 - 設備管理系統是什麼?功能、應用、價值

一、設備管理系統定義 設備管理系統(EAM)是一種用於有效管理和監控企業內部設備的信息系統。它涵蓋了從設備採購、部署、管理、設備報修維修、設備維保到報廢的整個生命週期。設備管理系統的目標是確保設備在其整個壽命週期內能夠高效運行,降低設備故障率,提高生產效率,並確保設備合規性和安全性。 二、設備管理工作面臨的痛點 1、設備管理信息零散,缺乏長期、完整的信息管理 傳統的管理模式信息記錄在紙質介質

segmentfault , 人工智能 , 前端

收藏 評論

雨花石 - 前端瀏覽器緩存

一、瀏覽器緩存簡介 1、瀏覽器通過緩存服務器返回的資源(針對靜態資源和get請求),減少傳輸壓力,提高訪問速度。 2、那麼緩存的目標應該是:資源可以被緩存 + 保證不使用過期的資源 + 服務器資源部分更新的時候不能導致新舊文件內容不一致。所以可以結合實際情況,設置適當的緩存策略。 3、瀏覽器無緩存的過程: 瀏覽器請求 --- 無緩存 --- 請求WEB服務器 --- 請求響應 -

HTTP , HTTPS , 安全 , 前端

收藏 評論

miadk - PHP+Uniapp助力婚戀社交:相親交友系統平台的商業化模式與運營策略

一、商業化模式 會員訂閲制 核心功能:提供基礎免費服務(如註冊、瀏覽),高級功能(如精準匹配、無限私信、查看訪客記錄)需付費解鎖。 差異化定價: 按訂閲時長(月/季/年)或功能等級(普通/VIP/至尊)分層定價,滿足不同用户需求。 案例:通過PHP後端實現會員權限管理,Uniapp前端提供流暢的付費流程體驗。 虛擬禮物與增值服務 功能設計:用户可購買

小程序 , app , 後端 , 前端

收藏 評論

兔子先森 - 前端頁面單詞、網址溢出換行

效果: 在css中,對文字可以使用:flex-wrap: wrap; 來實現文字溢出換行。 但如果文字是英文、網址,該屬性則無效。 我們需要對英文、網址進行斷字,然後使其換行,下面是mdn的解釋: .company_detail_webaddress{ max-width: 55%; margin-right: 10rpx;

react , vue.js , css3 , 前端 , Javascript

收藏 評論

YILS_LIN - 第三方Cookie失效時的新解決方案

本文首發於我的博客 YILS's Blog,首發地址:第三方Cookie失效時的新解決方案 (yils.blog) 第三方 Cookie 一直是網絡的重要組成部分,這已持續了 25 年。 然而隨着瀏覽器對隱私保護的加強,為了防止跨站跟蹤,第三方 Cookie 的使用變得越來越受限。即使你已經正確設置了 SameSite=None; Secure;,仍然可能會遇到 Set-Cookie 失效的問題。

chrome , JAVA , cookie , 前端 , Javascript

收藏 評論

六月的可樂🥤 - 強烈推薦 Web前端在線代碼IDE(代碼編輯器)

好用代碼在線編輯器推薦 在前端開發的世界裏,一款高效、便捷的代碼編輯器是每位開發者的得力助手。今天,我將以一名前端技術愛好者的身份,為大家介紹一款專注於前端領域的免費在線代碼編輯器——ColaOnlineCoder。它不僅支持在線編輯和預覽HTML、CSS、JavaScript等前端代碼,還集成了豐富的在線前端框架模板,以及強大的AI編程助手能力,為前端開發帶來了前所未有的便捷與可能。 這裏先貼一

css3 , 人工智能 , typescript , 前端 , html5

收藏 評論

DiracKeeko - [axios] axios發送 及 接收處理二進制數據

一、發送攜帶二進制數據的請求 在圖片上傳、文件上傳等場景中,需要發送payload為二進制數據的'POST'請求 注: 只要請求體中不是純 JSON 或字符串,而是包含或完全由二進制數據構成的內容 (如文件、音視頻、圖片),就需要發送payload為二進制數據的'POST'請求。 這裏的重點是設置headers,先介紹如何發送這種特殊的請求。 分別以 1.axios(config) , 2.

文件上傳 , 二進制 , Axios , blob , 前端

收藏 評論

雨花石 - webpack優化:提高二次構建速度

痛點: 開發過程中改一行代碼卻要等webpack構建半天實在太捉急。 項目背景 我們的項目是@vue/cli4生成的,基於webpack和vue2開發,未使用ts。用到了很多jquery、lodash、echarts等第三方依賴。 參考: @vue/cli4已經默認配置過一些優化方法了,比如為babel-loader增加cache-loder。請教了deepseek和google之後,根據項目的實

vue.js , vue-cli4 , webpack , 前端 , Javascript

收藏 評論

溪抱魚 - 第七章: SEO與渲染方式

第7章: SEO與渲染方式 在現代Web開發中,JavaScript扮演着越來越重要的角色。然而,JavaScript的廣泛使用也為搜索引擎優化(SEO)帶來了新的挑戰。本章將深入探討JavaScript SEO的核心問題,不同的渲染機制對SEO的影響,以及如何優化JavaScript驅動的網站以獲得更好的搜索引擎排名和用户體驗。 1. Google爬蟲類型及其工作原理 搜索引擎爬蟲是SEO的核心

seo , 前端

收藏 評論

溪抱魚 - 第七章: SEO與渲染方式 二

上一章的回顧 2. 網頁渲染機制及其對SEO的影響 在現代Web開發中,選擇合適的渲染機制對於優化搜索引擎性能至關重要。儘管Google的爬蟲技術在不斷進步,但不同的渲染方式仍然會對SEO產生顯著影響。讓我們深入探討主要的渲染機制及其對SEO的影響。 2.1 客户端渲染(CSR) 客户端渲染是單頁應用(SPA)常用的渲染方式,它依賴瀏覽器端的JavaScript來生成頁面內容。 工作原理:當

seo , 前端

收藏 評論

溪抱魚 - 第七章: SEO與渲染方式 三

上一篇 3. JavaScript SEO最佳實踐 在實施JavaScript SEO時,有幾個關鍵領域需要特別關注。以下是一些最佳實踐,可以幫助我們優化JavaScript驅動的網站。 3.1 內容可見性優化 確保搜索引擎能夠看到和理解我們的內容是至關重要的。 延遲加載優化: 使用 noscript 標籤為不執行JavaScript的爬蟲提供關鍵內容。 img src="place

seo , 前端

收藏 評論

幸福的鬧鐘 - 我們都被困在系統裏的…程序員

前言 2020年外賣最火熱的時候,有一篇文章《外賣騎手,困在系統裏》。 作為一個互聯網從業人員,我之前從未有機會體會到,當每一個工作都要被時間和算法壓榨時,我會是一種怎樣的感受。 而最近的一段經歷,我感覺也被困在系統裏了。 起因 如果你是一個研發人員,免不了要值班、處理線上問題。當然這都很正常,每個系統都有bug或者諮詢類的問題。 由於我們面臨的客户比較多,加上系統有一些易用性的問題或bu

react-native , JAVA , 程序員 , 後端 , 前端

收藏 評論

溪抱魚 - SEO分頁基本功

SEO分頁基本功 1. 分頁器的實現 Bad Case 如圖,這是一個janitorai實現的分頁器,他是採用div的形式。 我們到SEMRush去查詢這個頁面的流量,可以觀察到,這整個頁面只被爬取了第一頁的數據 這其實驗證了第七章1.3 Googlebot的工作原理:Googlebot會先分析HTML裏的待爬取鏈接(a標籤)和需要下載的JS文件,選擇性的下載JS文件,然後嘗試渲染和執行JS

seo , 前端

收藏 評論