博客 RSS 訂閱

grapecity 頭像

葡萄城技術團隊 - JavaScript 異步編程指南：async/await 與 Promise 該怎麼選？

在 JavaScript 開發中，異步操作就像家常便飯 —— 從調用後端 API 到讀取本地文件，幾乎無處不在。但很多開發者都會困惑：到底該用 Promise 的鏈式調用，還是 async/await 語法？其實答案很簡單：沒有絕對的好壞，只有場景的適配。 今天我們就用實際案例聊聊，這兩種異步寫法各自適合什麼場景，以及如何在項目中混搭使用，讓代碼既高效又易讀。 先搞懂：兩者不是對立關係 很多人以為

異步編程 , Javascript

收藏 評論

flappycat 頭像

敲鍵盤的貓 - R3高級用法

R3（以 UniRx 為例）的核心價值遠不止“監聽數值變化更新UI”——它的“響應式事件流”思想和豐富的操作符，能解決遊戲開發中大量複雜場景（如異步流程、狀態聯動、事件過濾、行為預測等）。很多人停留在基礎用法，本質是對“響應式思維”和操作符組合的理解不足。以下是 R3 的高級用法及典型場景，附代碼示例： 一、高級用法：從“單一數值監聽”到“複雜事件流處理” 1. 多事件流組合：解決“條件聯動”問題

unity , 遊戲開發 , 異步編程

收藏 評論

grapecity 頭像

葡萄城技術團隊 - 用 evaluateFormulaAsync 實現高效異步公式計算

在表格應用開發中，公式計算是核心能力之一。傳統同步公式計算在處理耗時任務（如複雜邏輯運算、異步API交互）時，容易導致用户界面（UI）凍結，嚴重影響用户體驗。為解決這一痛點，SpreadJS V18.2 正式推出 evaluateFormulaAsync 方法，提供異步公式計算能力，兼顧計算效率與交互流暢性。本文將從特性概述、注意事項、適用場景、API細節及實戰示例五個維度，全面解析該新特性。

異步編程

收藏 評論

evans_bo 頭像

Evans_波 - 從零開始搭建 TS + webpack-dev-server 的開發環境

目的： 可使用 TypeScript 來開發項目 結合 webpack-dev-server 的熱重載，提升開發效率 瞭解相關依賴和配置的作用 準備 一、初始項目目錄結構（非常簡單） |_ src | |_ index.ts |_ public |_ index.html（只需在body標籤中添加script src="./index.js"/script）

webpack-dev-server , typescript , 前端

收藏 評論

taoguo 頭像

我是好人 - 你的項目切換代理需要重啓嗎？

問題 參與過多人項目之後，總是會碰到下面的問題。 需要跟另一個人對接了，那麼就要把代理的target改成他的ip地址，改完還得重啓項目。 別人把配置文件的代碼提交了，覆蓋了我的target配置。又得改回來，再次重啓項目。 有可能配置文件的代碼是這樣的 module.exports = { devServer:{ proxy:{ '/api':{

webpack-dev-server , 代理 , webpack , vue-cli , 前端

收藏 評論

yazi_6005853a842a6 頭像

FYR的仁 - vue-批量導入文件篇（一）

序言 在我們創建路由的時候，會發現如果所有的路由都在一個文件內，那麼當項目路由多的時候，就會出現路由難找，路由跟路由不在一塊等情況出現（沒維護好）。 所以，為了避免這種情況，我們可以使用模塊化這種思想來解決問題。 那麼，問題就來了，當模塊多的時候，一個個的導入就很浪費時間，需要重複 引入 - 賦值 這一過程，所以，我們是不是能讓程序來幫我們做這一步驟呢，那麼我們豈不是可以愉快玩耍了。

vue.js , webpack-dev-server , vite

收藏 評論

kaidiwen 頭像

Max迪丶先生 - 解決webpack5使用webpack-dev-server熱更新，改變內容頁面無法自動更新並且報錯

其實頁面文件已經進行了熱替換，但需要手動刷新，頁面才能進行更新。當前問題只在webpack5出現，問題出在哪裏？ 報錯問題：[HMR] Update failed: ChunkLoadError: Loading hot update chunk main failed. 網上看到一些熱更新失敗處理做法： 1：在webpack.config.js添加target: 'web' 2：刪除.brow

熱更新 , webpack-dev-server , webpack5 , hmr

收藏 評論

icecreamlj 頭像

一顆冰淇淋 - webpack dev server 與 hot module replace 提高開發效率

通過 webpack 命令編譯源代碼時，如果我們對源代碼進行了修改，需要重新執行命令才能看到編譯後的效果。 這樣在開發中非常的影響效率，如果存在一種方式，當文件被修改時，webpack 自動監聽重新編譯，並反饋給開發者，這樣就能更高效的進行開發。 watch 我們通過 webpack 執行命令時，編譯完成之後進程會停止，而 webpack --watch 編譯完成後，不會停止進程，並且當文件內容發

webpack-dev-server , webpack , 前端 , Javascript

收藏 評論

cafehaus 頭像

咖啡教室 - vue項目中webpack-dev-server的open和host0.0.0.0配置衝突

一個比較老的公司項目，webpack 用的 v3 版本，為了實現localhost、127.0.0.1和本機ip可以同時訪問，webpack的devServer裏的 host 我們一般會設置成 0.0.0.0，這樣本機所有 ipv4 地址都可以實現訪問。 比如我們要將本地運行的前端項目，分享給公司的後端、產品、測試...預覽效果，如果 host 直接設置的 localhost，運行後打開的地址 h

vue.js , webpack-dev-server , webpack , 前端

收藏 評論

icecreamlj 頭像

一顆冰淇淋 - 抽絲剝繭：詳述一次DevServer Proxy配置無效問題的細緻排查過程

事情的起因是這樣的，在一個已上線的項目中，其中一個包含登錄和獲取菜單的接口因響應時間較長，後端讓我嘗試未經服務轉發的另一域名下的新接口，舊接口允許跨域請求，但新接口不允許本地訪問（只允許發佈測試/生產的域名訪問）。 問題 那麼問題來了，本地環境該如何成功訪問到新的接口並驗證業務功能是否生效呢？ 嘗試過程 我首先就想到了直接在 webpack 項目中配置 devServer，並且修改接口地址

webpack-dev-server , node.js , webpack , 前端 , Javascript

收藏 評論

icecreamlj 頭像

一顆冰淇淋 - 從0到1：React項目中的Webpack配置實戰

公司項目一般都是使用集團封裝好的腳手架，腳手架內部實現咱看不到也摸不着，好不容易組內推行新的UI框架，需要自行定義 webpack 配置，這可是個絕佳的好機會，我對配置過程進行了梳理，把商業項目的成熟配置小跑着送上。 初始化 首先新建一個空文件夾，執行 npm init 初始化生成 package.json 文件。 創建 src 文件夾，項目的業務代碼都放在這裏，再創建 index.js，這是項目

react , webpack-dev-server , webpack , 前端 , Javascript

收藏 評論

jiang_rong 頭像

jiang_rong - 高清屏下正確顯示1px寬度的圓角邊框

直接設置border:1px solid #ccc;在手機下看會比設計稿粗（這裏由於是灰色可能不是那麼明顯。。。。。用紅色綠色藍色之類的粗細差異很大），瀏覽器邊框的最小的顯示像素是1px,設置0.5px也是會渲染成1px的效果，而在css的1px根據手機的品牌或型號不同在高清屏的物理像素是2像素或者3像素 div class="list-wrapper border-1px

移動端web , Css

收藏 評論

hezhongfeng 頭像

hezhongfeng - Vue完美記住滾動條和實現下拉加載

滾動條 常見於移動端 App 在滾動點擊進入的時候 問題描述 當我們在開發 web app 的時候，經常會遇到一個問題，就是當從一個可滾動的列表頁進入到下一個詳情頁面，然後返回列表頁面的時候，很難去還原滾動條的狀態，無法記住進來時候的位置。 以前我嘗試過很多方法： 有 vue-router 自帶的 scrollBehavior，需要記住 scrollTop，然後還原，但是管理這個 scroll

vue.js , vue-router , webapp , 移動端web , 即時通訊

收藏 評論

yangxiansheng_5a1b9b93a3a44 頭像

羊先生 - 完整版移動端滑動事件封裝

touchEvent 基於Jquery擴展在移動端產生的事件，包含，單次觸摸事件，兩次觸摸事件，長按事件，滑屏事件，向上滑動事件，向下滑動事件，向左滑動事件，向右滑動事件 預覽 地址預覽 https://hangjob.github.io/touchEvent/index.html 事件類型 單次觸摸事件 $(el).tap tap: function(element, fn) {

移動端web , jquery , 前端 , html5 , Javascript

收藏 評論

chen_6016206b422ca 頭像

chen - 移動端click事件300ms延時解決方案

問題描述 移動端由於屏幕雙擊會縮放頁面，因此移動端click事件會有300ms延時情況的產生 解決方案 方法一：全局禁止縮放 在html頁面頭部的meta標籤中加上content="user-scalable=no" meta content="user-scalable=no" 該方法會讓瀏覽器禁用默認的雙擊行為並且去掉300ms點擊延時 適用場景：需要對整個頁面進行禁用雙擊行為。但

移動端web , 前端 , Javascript

收藏 評論

fulade 頭像

弗拉德 - 【Flutter 2-9】Flutter手把手教程UI佈局和Widget——彈性佈局控件Flexible

作者 | 弗拉德 來源 | 弗拉德（公眾號：fulade_me) Flexible Flexible可以幫助Row、Column、Flex的子控件充滿父控件，它的用法很靈活，也具有權重的屬性。跟Flexible相類似的控件還有Expanded。 先來看Flexible的構造函數 const Flexible({ /// key Key key, // 默認 fl

跨平台 , flask , flutter-swiper , 移動端web , ios

收藏 評論

fulade 頭像

弗拉德 - 【Flutter 2-10】Flutter手把手教程UI佈局和Widget——流式佈局Wrap

作者 | 弗拉德 來源 | 弗拉德（公眾號：fulade_me) Wrap 在Flutter中Wrap是流式佈局控件，Row和Column在佈局上是很好用，但是有一個缺點，如果當子控件數量過多導致Row或Column裝載不下的時候，就會出現UI頁面上的錯誤。Wrap可以完美的避免這個問題，當控件過多一行顯示不全的時候，Wrap可以換行顯示。 當然Wrap跟Row和Column有着很多相似的地

跨平台 , Android , 移動端web , flutter , ios

收藏 評論

fulade 頭像

弗拉德 - 【Flutter 2-11】Flutter手把手教程UI佈局和Widget——列表ListView

作者 | 弗拉德 來源 | 弗拉德（公眾號：fulade_me) ListView ListView是在移動端非常常見的控件，在大多數的展示場景中都離不開ListView。在Flutter中對ListView的封裝也非常好，簡單幾行代碼就可以滿足我們佈局一個滾動列表的需求。 先來看一下構造函數： ListView({ /// key Key key, /// 佈局方向

跨平台 , Android , 移動端web , flutter , ios

收藏 評論

mihuartuanr 頭像

米花兒團兒 - 使用Flexible & swiper進行移動Web開發

移動端適配方案flexible.js 出發點 事故的開始總是有原因的，那思考一下，為什麼使用Flexible? [ ] 為了rem佈局？ 為什麼要rem佈局 —— 高度還原 [ ] 移動端適配? 為什麼移動端適配要用Flexible —— 同等佔比 [ ] 什麼是移動端適配？ 最初點是設計圖的高度還原！！！ 以750*1334設計稿(iPhone6)為準，期望每一個設計元件在iPho

vue.js , mobile , 移動端web , swiper.js , h5頁面

收藏 評論

tuihou123321 頭像

tuihou123321 - 前端面試寶典：移動端核心知識篇

前言： 想系統學習前端面試題，強烈推薦瀏覽 在線電子書（支持手機版，不斷更新） 。 本書特點：系統全面（涵蓋前端核心技術點），簡潔，針對性強（針對面試場景設計）。 歡迎在github上留言反饋 移動端 移動端高清屏適配方案？ 幾個要解決的重要問題： 佈局 字體大小 1px邊框 高清圖 參考資料： 移動端高清屏適配方案 移動端尺寸單位？ px: 絕對長度單位， rem：相對長度單位，相對

面試 , 移動端web

收藏 評論

alibabawenyujishu 頭像

阿里巴巴文娛技術 - 優酷質量保障系列(二）—客户端自動化測試基礎能力建設

文娛妹導讀 自動化測試能力建設過程中，自動化框架選型、框架設計核心和思路、自動化能力平台接入，是自動化測試能力建設過程中重要環節。文章分享優酷APP自動化測試能力建設過程中的經驗 本系列文章將陸續發佈，感興趣的朋友持續關注！ 前言 隨着移動端版本迭代的加快，快速測試，快速反饋已經是一個常態化的流程，週期內版本發佈頻率的增加，各項測試的時間正在急劇縮短，且迴歸性的任務不斷充斥當中，

工具 , 測試 , 移動端web , 自動化測試 , 前端

收藏 評論

tap_taq 頭像

Tap? taq - 關於移動端

視口 總共可分為3個視口：佈局視口，視覺視口，理想視口 佈局視口： 1. 一般移動設備的瀏覽器都默認設置一個佈局視口，用於解決早起的PC端頁面在手機上顯示的問題 2. 這個視口的分辨率基本都設置為980px 視覺視口： 用户所看到的網站區域 理想視口： 使得網站在移動端有最理想的瀏覽和閲讀寬度而設定的，是最理想的視口尺寸 要手動添加meta視口標籤，主要目的：佈局視口的寬度應該與理想視口的寬

移動端字體大小 , 移動端web , 移動端適配

收藏 評論

yangxiansheng_5a1b9b93a3a44 頭像

羊先生 - Vue適配PC+大屏，手機+ipad適配

PC+大屏適配 可適配 1400px以上的屏幕 查看演示 項目地址 設置設計稿-轉換rem 我們的設計稿是3840px寬度，所以widthOfDesignLayout設置3840 module.exports = { plugins: { autoprefixer: {}, "@njleonzhang/postcss-px-to-rem": {

vue.js , 移動端web , 前端 , html5

收藏 評論

yangge_5c6804373b5a0 頭像

陽哥 - 支付寶小程序開發上拉加載實現

寫這篇文章起源於我們的產品經理提的一個需求，我們是做一個課程購買的小程序。每個課程下面有n節課。當點課的時候跳轉到課程學習頁面，並且查詢當前課在設定分頁數和分頁大小（默認7）所在的列表，以及它的位置。 如圖： 每節課對應一個序號。默認展示7條數據。當用户上拉的時候加載前面7條數據（即第一頁），下拉加載後面一個分頁7條數據。 那麼加載後面一個分頁數據我們可以通過小程序onReac

事件 , 移動端web

收藏 評論