動態

@vivo_tech

如何“拼”出一個頁面-遊戲中心模塊化實踐

一、背景 vivo遊戲中心是一款垂類的應用商店,為用户提供了多元化遊戲的下載渠道。隨着遊戲中心手遊品類的豐富,各品類用户的量級也不斷增加,不同遊戲偏好的用户核心關注點也不同,從預約、測試、首發、更新到維護,不同遊戲生命週期節點的運營需要突出的重點不同。 針對上述不同業務場景,運營人員為了服務好廣大的vivo遊戲用户,需要進行精細化運營,以不同的視覺樣式呈現給不同用户。比如,針對獨立遊戲品類的用户,

vivo_tech 頭像

@vivo_tech

昵稱 vivo互聯網技術

@smileZAZ

記錄--JavaScript 中有趣的 9 個常用編碼套路

這裏給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 1️⃣ set對象:數組快速去重 常規情況下,我們想要篩選唯一值,一般會想到遍歷數組然後逐個對比,或者使用成熟的庫比如lodash之類的。 不過,ES6帶來了一個新玩意兒!它引入了一個全新的對象類型:Set!而且,如果結合上...展開運算符,我們可以超級快速地創建一個已經去重的全新數組!😎 const arr = [

smileZAZ 頭像

@smileZAZ

昵稱 林恆

@ccVue

簡單實用摺疊面板可以摺疊收起展開內容區域

前端簡單實用摺疊面板可以摺疊收起展開內容區域,閲讀全文下載完整代碼請關注微信公眾號: 前端組件開發 效果圖如下: 代碼如下: # 簡單實用摺疊面板可以摺疊收起展開內容區域。 #### 使用方法 ```使用方法 !-- leftText:做標題 rigText: 有註明文字 isOpen:展開摺疊狀態 isIcon:是否展示箭頭圖片 默認true -- C

ccVue 頭像

@ccVue

昵稱 前端組件開發

@licin

驗證碼插件 vercode.js

第1代圖片驗證碼 -字母數字型 第2代滑動驗證碼 - 圖片截取型 第3代驗證碼 - 選圖型 vercode.js 結合了上面的情況下新研發的一種驗證碼。 驗證碼類型 驗證碼描述 操作性 安全性 描述 字母數字型圖片驗證碼 這是一種通過後台隨機碼生成圖片的驗證碼。服務器會在隨機碼生成時保

licin 頭像

@licin

昵稱 名字什麼都是浮雲

@jisujia02

光模塊和光電轉化器的區別

近年來,光電轉換器廣泛應用於數據中心機房,主要與交換機、網卡等產品配套使用。對於通信行業的專業人士來説,光電轉換器並不陌生,但由於有些用户對光電轉換器並不是很瞭解,本文將詳細介紹光電模塊的定義和用法,並帶領大家重新認識光電轉換器。 一、光電轉化器是什麼?是光模塊嗎? 其實這兩個名字都不是真正的職業名字,但都是各自的習慣用語。你可以認為這兩樣東西功能相同,但光模塊可能更側重於集成產品,即光探測器和後

jisujia02 頭像

@jisujia02

昵稱 極速佳02

@guochenglong

Vuejs大型項目實踐-面向服務設計與業務模塊化

前端架構概覽 思考:我們有什麼,我們缺什麼? 前端架構分為很多部分,在每個不同的項目裏都會有各自的特點。所以,當我們想優化一個大型項目的時候,可以從一個概覽圖來入手分析,比如下圖: 從我自己的項目特點來分析,我們的基礎設施比較完備,一些公共的基礎服務都可以嘗試接入,唯獨業務代碼異常混亂。 原因:由於業務迭代頻繁,接手的人多,導致組件規範不好、公共方法沒有抽離。而且各個業務之間代碼耦合性很強,看似

guochenglong 頭像

@guochenglong

昵稱 為君持酒勸斜陽

@lin494910940

閒來無事整個“方塊消消樂”小遊戲

寫在前面的話   在996是福報,“付費上班”的如今。身為信息化進程的一顆螺絲釘,每天的通勤時間要四十幾分鍾(僅僅是在地鐵上哦),漫漫這時候回家路難免顯得有點寂寞有點空虛。這時好學的人會説聽聽有聲書,趁着下班時間提升自己。而我可要優雅的迴應道:“老子搬了一天磚了,下班還不能享受享受了”。這不就迷上了各種小遊戲,什麼“種樹賺錢”,“鬥地主”,“消消樂”,這不就被小遊戲給腐蝕了一心工作的 心靈。某團的

lin494910940 頭像

@lin494910940

昵稱 七分暖

@bugDiDiDi

js/jquery 關於select 的一些操作

1. 如何設置默認選中呢 設置默認選中可在option 中添加 selected = "selected",具體舉例如下: option value="2" selected="selected"test2/option select id="citySel" class="select" option value=""請選擇城市/option option va

bugDiDiDi 頭像

@bugDiDiDi

昵稱 可樂去冰多來番茄醬

@shawnphang

如何優雅地編寫一個高逼格的JS插件?

在一個風和日麗的早晨,我正悠閒地喝着Coffe,突然領導向我走來,我趕緊熟練地切出VSCode,淡定自若地問:領導,什麼事?領導拍了拍我的肩膀:你上次封裝的方法同事跟我反饋使用起來很不錯啊,你不如做成JS插件給大家用吧。我放下了手中的馬克杯,甩了一下眼前僅剩的幾根劉海:沒問題啊,小Case!隨即開始摸魚.... 原型鏈寫法 要開始編寫插件就得先了解JS模塊化,早期的模塊化是利用了函數自執行來實現的

shawnphang 頭像

@shawnphang

昵稱 茶無味的一天

@jingdongkeji

極致性能優化:前端SSR渲染利器Qwik.js

引言 前端性能已成為網站和應用成功的關鍵要素之一。用户期望快速加載的頁面和流暢的交互,而前端框架的選擇對於實現這些目標至關重要。然而,傳統的前端框架在某些情況下可能面臨性能挑戰且存在技術壁壘。 在這個充滿挑戰的背景下,我們引入了 Qwik.js 框架。Qwik.js 不僅是一個前端框架,更是一種前端性能的終極解決方案。它不僅提供了卓越的性能,還以其獨特的特點和優勢脱穎而出。 讓我們一起深入探索 Q

jingdongkeji 頭像

@jingdongkeji

昵稱 京東雲技術團隊

@wmbuke

jQuery.js - 前端必備的Javascript庫

作者:WangMin 格言:努力做好自己喜歡的每一件事 jQuery.js 是什麼? jQuery是一個快速簡潔、免費開源易用的JavaScript框架,倡導寫更少的代碼,做更多的事情 。它封裝JavaScript常用的功能代碼,提供了一種簡便的JavaScript設計模式,以及我們開發中常用到的操作DOM的API,優化HTML文檔操作、事件處理、動畫設計和Ajax交互,使更多的網

wmbuke 頭像

@wmbuke

昵稱 汪末末

@beiyouzhiyu

JDK 新特性學習筆記之模塊系統

有兩條小魚快樂地遊着,碰到一條老魚從對面游過來。老魚向他們點頭問好:「早上好啊小夥子們,今天的水怎麼樣?」兩條小魚接着遊了一會兒,突然停了下來,一臉懵逼地看着對方:水是個什麼東西? 習以為常的就是水 模塊系統是JDK 9的特性,後面的JavaFX學習筆記都會基於JDK 11,甚至更高版本。同時這個特性也是我比較感興趣的,進一步強化了Java的封裝能力。 回顧Java的特性 我想起剛畢業找

beiyouzhiyu 頭像

@beiyouzhiyu

昵稱 北冥有隻魚

@youyoufei

LayUI多文件上傳,支持歷史上傳預覽

記錄一次項目開發中,LayUI多個圖片進行優化,需要支持多個圖片上傳、可刪除某一個圖片、支持加載上次上次圖片。 頁面代碼: div class="layui-upload" button type="button" class="layui-btn layui-btn-normal" id="ID-upload-demo-files"選擇多文件/b

youyoufei 頭像

@youyoufei

昵稱 有趣的靈魂ღ

@it1042290135

js頁面當中沒有寫回車事件,但是有回車效果

前兩天遇到一個問題,研究了我很差事件。問題如下: 頁面只有一個文本框,沒有寫任何回車事件,但是點回車的時候,就會觸發回車,回傳頁面。 於是各種google,終於有了結果: 如果表單裏有一個type=”submit”的按鈕,回車鍵生效。 如果表單裏只有一個type=”text”的input,不管按鈕是什麼type,回車鍵生效。 如果按鈕不是用input,而是用button,並且沒有加type

it1042290135 頭像

@it1042290135

昵稱 —阿峯—

@smileZAZ

如何判斷一個元素是否在可視區域中?

一、用途 可視區域即我們瀏覽網頁的設備肉眼可見的區域,如下圖 在日常開發中,我們經常需要判斷目標元素是否在視窗之內或者和視窗的距離小於一個值(例如 100 px),從而實現一些常用的功能,例如: 圖片的懶加載 列表的無限滾動 計算廣告元素的曝光情況 可點擊鏈接的預加載 二、實現方式 判斷一個元素是否在可視區域,我們常用的有三種辦法: offsetTop、scrollTop

smileZAZ 頭像

@smileZAZ

昵稱 林恆

@smileZAZ

記錄:瀑布流最佳實現方案

傳統實現方式 當前文章的gif文件較大,加載的時長可能較久 這裏我拿小紅書的首頁作為分析演示 可以看到他們的實現方式是傳統做法,把每個元素通過獲取尺寸,然後算出left、top的排版位置,最後在每個元素上設置偏移值,思路沒什麼好説的,就是算元素座標。那麼這種做法有什麼缺點?請看下面這張圖的操作 容器尺寸每發生一次變化,容器內部所有節點都需要更新一次樣式設置,當頁面元素

smileZAZ 頭像

@smileZAZ

昵稱 林恆

@xw-01

jQuery

一、JQuery瞭解 1 .原生JS的問題 我們會發現原生的JS編程很麻煩,尤其在兼容性的問題 選擇元素,權限兼容的只有getElementById和getElementsByTagName;其他方法都有兼容問題 樣式操作也有兼容問題,還得我們自己封裝,封裝getStyle() 動畫也麻煩,也得自己封裝,封裝animation() HTML節點操作也挺麻煩的 JS裏面麻煩的都是和DOM編程有關的

xw-01 頭像

@xw-01

昵稱 二價亞鐵

@kitty-38

JavaScript的常用庫 —— jQuery

jQuery 用來更加方便地去控制前端的HTML標籤和CSS屬性。 使用方式: 1. 直接在head元素中添加: script src="https://cdn.acwing.com/static/jquery/js/jquery-3.3.1.min.js"/script 2. 按jQuery官網提示下載。 https://jquery.com/download/ 選擇器: $

kitty-38 頭像

@kitty-38

昵稱 kitty又困了

@yulong1992

漸變頁面

!DOCTYPE html html lang="en" head meta charset="UTF-8" meta name="viewport" content="width=device-width, initial-scale=1.0" titleRadial Gradient Background/title /head body style="backg

yulong1992 頭像

@yulong1992

昵稱 程序員玉龍

@sofastack

塗鴉智能落地 Koupleless 合併部署,實現雲服務降本增效

文|八幡、朵拉 杭州塗鴉智能技術專家\ 主要研究微服務與可觀測、消息引擎、任務調度、數據層中間件等領域。 本文5389字 閲讀15分鐘 當前塗鴉通過 Koupleless 的靜態合併部署能力,很好地解決了資源浪費問題。為了進一步提升研發效率,塗鴉與 Koupleless 正在開發動態合併部署能力,為公有云大規模合併部署打下基礎,也為未來更長遠的 Serverless 能力提供基座。 p a

sofastack 頭像

@sofastack

昵稱 SOFAStack

@linx

Web前端入門第 83 問:JavaScript localStorage 有大小限制嗎?溢出會怎樣?

本地存儲除了 Cookie 外,還有 localStorage 和 sessionStorage,本文一探 localStorage。 localStorage 此 API 存入的數據會 永久 保存在瀏覽器中,除非用户手動刪除。 localStorage 能用於同一瀏覽器同一域名跨標籤頁通信。 同一瀏覽器無痕模式和非無痕模式下,localStorage 存儲的數據無法互通,且無痕模式存入的數據在瀏

linx 頭像

@linx

昵稱 前端路引

@codechen8848

格式轉換全能王!一個開源自託管的文件轉換神器

大家好,我是 Java陳序員。 在日常工作生活中,常常需要對一些文件進行轉換,如不同格式的照片進行轉換,還有 Office 各文檔之間的轉換等。但常常找不到趁手的工具,使用在線工具又擔心隱私泄漏。 今天,給大家介紹一個開源自託管的文件轉換神器,支持超多種文件格式轉換,可以説是格式轉換全能王! 關注微信公眾號:【Java陳序員】,獲取開源項目分享、AI副業分享、超200本經典計算機電子書籍等。

codechen8848 頭像

@codechen8848

昵稱 codechen8848

@linx

Web前端入門第 84 問:JavaScript sessionStorage 那些容易踩坑的地方

sessionStorage 與 localStorage 差不多可以算作一對兄弟,它倆的暴露的 API 方法一模一樣。 但兩者也有不同點: 1、sessionStorage 存入的數據在頁面關閉後,會自動清除。 2、相同 URL 的每個 tab 頁籤的 sessionStorage 會被隔離,互不影響。也就是説相同的鏈接,在 A 標籤頁打開和在 B 標籤打開,A 寫入的 sessionSt

linx 頭像

@linx

昵稱 前端路引