全文共6511字/词，阅读大概需要13分钟，太长不看党请直接移步👉「开始优化」部分直接查看优化手段 📷 背景 前段时间公司服务器网络波动，网站访问变慢，一些性能问题也随之暴露了出来。纷纷反馈在这样的弱网条件下，访问新项目时，加载了近1分钟都没加载出来，而访问其他页面顶多也就30-40s。 在网络恢复后，尝试访问了下页面，无缓存首次打开需要等待近11s的时间，最大的资源达到了3.7M... 在对项目做了一些优化处理后，再次无缓存打开可以发现网页几乎是秒开，平均耗时在1s以内 在这里总结记录一下，基本上都是一些
今天大师兄碰到一新来的实习生在使用 alert 调试H5页面，仿佛看到大师兄年少时羞涩的样子...
1. Page Front-matter 写法 解释 title 【必需】页面标题 date 【必需】页面创建日期 type 【必需】标签、分类和友情链接三个页面需要配置 updated 【必需】标签、分类和友情链接三个页面需要配置 description 【可选】页面描述 keywords 【可选】页面关键字 comments 【可选】显示页面评论模块 (默认 true) top_img 【可选】页面顶部图片 mathjax 【可选】显示 mathjax (当设置 mathjax 的 per_page:
Autocomplete 顾名思义就是自动完成，在 input 框中输入内容时，将会自动补全符合输入内容的信息。
这些都是旧时代非常突出的问题，对开发效率影响非常大，直到… 出现了很多的工程化工具，比如：webpack、vite、esbuild、rollup.js 等等
修改网站各种资料，例如标题、副标题和邮箱等个人资料，请修改博客根目录的_config.yml
本教程总共9篇,每日更新一篇,请关注我们!你可以进入历史消息查看以往文章,也敬请期待我们的新文章! 1、React多页面应用1(webpack4 开发环境搭建,包括热更新,api转发等)---2018.04.04 2、React多页面应用2(webpack4 处理CSS及图片,引入postCSS,及图片处理等)---2018.04.08 3、React多页面应用3(webpack4 多页面实现)---2018.04.09 4、React多页面应用4(webpack4 提取第三方包及公共组件)---2018
gulpjs是一个前端构建工具，与gruntjs相比，gulpjs无需写一大堆繁杂的配置参数，API也非常简单，学习起来很容易，而且gulpjs使用的是nodejs中stream来读取和操作数据，其速度更快。如果你还没有使用过前端构建工具，或者觉得gruntjs太难用的话，那就尝试一下gulp吧。
.xControl { font-size: 15px; font-weight: bold; padding: 5px 0; box-shadow:0 0 20px #d0d0d0;/* 阴影 */ background-color: #FFFFFF;/* 背景颜色 */ border-bottom: 2px solid #e74c3c;/* 边 */ transition: all 0.1s linear; text-align: center; border-radius: 0 0 5% 5%; border-radius:4px; } .xControl a{ text-decoration: none; display: block; }
我们很多时候的创作都会出现一个误区，就是容易偏题！就像我们高中是写作文一样，我们拿到一个命题，我们首先要去审题，看看这个命题到底是让我们写些什么内容。当然，我们现在写的技术性博客，不完全像我们那时候写的作文一样。因为我们写的博客是我们自己去命题，然后根据自己的命题，去展开对这个问题的讲解。
之前做了一个纯 HTML+CSS 网站，完全没有 JS 代码，大家可以点击这个链接体验一下 https://woopen.github.io/ssp/ 。
事情是这样的，项目最近有个需求。服务器有个图片空间，说白了就是个文件夹。文件夹的结构大家都知道，一层一层的。然后需要在前端以树形展示。
对于前端页面来说，静态资源的加载对页面性能起着至关重要的作用。本文将介绍浏览器提供的两个资源指令-preload/prefetch，它们能够辅助浏览器优化资源加载的顺序和时机，提升页面性能。
到这里我们已经讲了游戏的整体设计和实现。一个游戏要完整，还需要给它制定一个评分机制，它是整个游戏的关键所在。就好比一部电影，特效再好看，如果剧情狗血，那也是一部烂片。 相信大家都玩过一些简单但很吸引人的小游戏。比如很久以前微信上的打飞机，围住神经猫，还有前段时间大火的slither.io。他们都简单易玩，但却能让人肾上腺素飙升，百玩不腻。 所以一款好玩的小游戏必须具备了这样的特点，简单易玩，却能给人制造紧张感，有时还能利用一些攀比心理。本游戏也基本具备了这样的特点。 计分实现 游戏以秒数作为计分，随着时间的
什么是内存泄露？内存泄露是指new了一块内存，但无法被释放或者被垃圾回收。new了一个对象之后，它申请占用了一块堆内存，当把这个对象指针置为null时或者离开作用域导致被销毁，那么这块内存没有人引用它了在JS里面就会被自动垃圾回收。但是如果这个对象指针没有被置为null，且代码里面没办法再获取到这个对象指针了，就会导致无法释放掉它指向的内存，也就是说发生了内存泄露。为什么代码里面会拿不到这个对象指针了呢，举一个例子：
上一篇主要讲了我学习前端的一个经历，以及为什么选择BuildAdmin作为深入前端学习的原因.同事也大致聊了一下学习前端需要使用哪些技术栈。
在 Markdown 中，```用来表示代码块，跟在后面的是语言类型，比如 js、java 和 diff 等
可以看到，六个绿色条并发请求，四个灰色条等待请求，最下面三个绿色条3.4s后才触发请求
一般来说，品牌介绍页都是少不了各种动画的。这里我列出了辅导品牌页的三个主要的动画，后面我会讲我的实现
H5 页面发版灵活，轻量，又具有跨平台的特性，在业务上有很多应用场景。但是同时对比 App，H5 的性能表现总是要逊色一筹，比如页面打开往往会出现白屏，滑动列表等交互场景下也不如 Native 页面流畅。针对这些白屏、卡慢之类的问题，我们测试该从哪些方面去展开测试分析和数据对比呢？接下来笔者分享一些 H5 前端测试实践的经验，抛砖引玉，希望大家一起谈论，一起挖掘更多有价值的课题。
个人选择了码云(gitee)作为我的图片存储仓库，单单存个图片什么的完全够用，文中用到的软件工具除了给出的官网地址外我还打包一份上传到了蓝奏云，大家按需下载即可，需要说明的是这个教程是基于Windows的。
本篇文章来自好友肥子哥，原文连接：https://xhhdd.cc/index.php/archives/80/
《葫芦兄弟》（又名：葫芦娃），是上海美术电影制片厂于1985-1987年原创出品的13集系列剪纸动画片，是中国动画第二个繁荣时期的代表作品之一，至今已经成为中国动画经典。讲述7只神奇的葫芦，7个本领超群的兄弟，为救亲人前赴后继，展开了与妖精们的周旋。
在前端开发中，JQuery 作为一个广泛应用的 JavaScript 库，为开发者提供了丰富的工具和方法，简化了 DOM 操作、事件处理等繁琐的任务。而在这个庞大的生态系统中，插件机制是 JQuery 的一项重要特性，使得开发者能够轻松地扩展 JQuery 的功能，实现更灵活、高效的前端开发。本篇博客将围绕 JQuery 插件机制展开详细的讲解，带你一探插件的神奇世界。
代码取自开源项目50projects50days，用作个人学习和巩固三件套的知识，增加了注释，可能会有小改动。
需要将很多的小区根据经纬度在地图上进行标注，随着业务的推进，小区标注点越来越多，如何将所有的小区合理的分布在有限的地图空间上便于管理者全局的观察成了一个亟待解决的问题！
天空的实现有多种方式，最常见的是一个包围全部的天空球，通常是UV球，也叫经纬球，其UV很方便映射到一张天空图片，比如：
本文主要探讨JPG/PNG转SVG矢量格式并支持FILL的方法，介绍在线转换网站和通过illustator转换的经验。
目前做代码压缩合并的工具有很多，诸如gulp，webpack，grunt等等，可以说这些项目构建工具的功能非常之强大：图片压缩、图片转base64、css和js的压缩以及合并，文件的md5重命名 ……。本人之前也是在项目中没具体使用过，闲来无事，查查资料，自己写了一个用gulp工具的小demo，有很多不足之处，欢迎指点。 第一步：安装node和npm 不用说，要用gulp，得先安装node和npm（安装完node后，自带有npm） Node官网下载地址：https://nodejs.org/en/downl
很久没写文章了，博客已经长草了，今天挤点时间分享一些小干货，也是回应一下不少站长朋友的留言问题。 有不少站长朋友问张戈博客的静态文件为啥是另外一个域名？有啥好处？如何实现？ 其实这算是一种动静分离的做
作为一名程序员，熟悉自己的开发工具，并能熟练的调试程序是必备的技能。低码开发也不例外，本篇教程就讲解一下在低码中如何进行调试程序。
前端项目随着时间推移和业务发展，页面可能会越来越多，或者功能和业务代码会越来越多，又或者依赖的外部类库会越来越多，这个时候原本不足为道的 webpack 构建时间消耗就会慢慢地进入我们的视野。
本文讲的图片上传，主要是针对上传头像的。大家都知道，上传头像一般都会分成以下 4 个步骤：
首先，HTTP 是一个网络协议，是专门用来帮你传输 Web 内容滴。关于这个协议，就算你不了解，至少也听说过吧？比如你访问俺的博客的主页，浏览器地址栏会出现如下的网址
微信小程序可以跨机型方便地调用设备的硬件，例如：摄像头、喇叭、蓝牙等。之前研究过蓝牙，但因为当时的接口限制和文档不多所以就没深潜；不过这个是个方向，有机会再展开吧。这次我们讲一下摄像头，功能大概是通过摄像头拍照后进行图片压缩后再Base64上传到服务器。
我们经常使用 Chrome Dev Tools 来开发调试，但是很少知道怎么利用它来分析页面性能，这篇文章，我将详细说明怎样利用 Chrome Dev Tools 进行页面性能分析及性能报告数据如何解读。如果你认真看了本文，一定能学会分析，没学会，你来找我～
TL;DR: 当我们在做性能优化的时候，我们究竟在优化什么？做性能优化需不需要了解底层的东西？需要了解到什么程度？浏览器底层是一个什么架构？浏览器渲染的本质究竟是什么？哪些方面对用户的体验影响才是最大的？有没有业内一些通用的标准或标杆参考？都1202年了，雅虎军规还有没有用？性能分析工具都有哪些？我们从哪方面进行分析才是合适的？
React的生命周期是组件在其生命周期内的一系列事件和方法调用，允许您管理组件的行为和状态。除了常见的生命周期方法如componentDidMount和componentDidUpdate之外，还有一些其他方法可供使用。
接 [一对一讲什么] 之 切图之后做啥？要加入项目和测试接口 上回书说，切完了页面，把HTML文件啊，CSS，JS，IMG图片什么都扔到相应的开发环境目录里，把链接神码的都搞好，然后在开发环境里把你的页面能运行起来，就像这样， 你的自己电脑上搞好的页面的访问路径是这样的： file:///D:/wesay/3/html5_1.html 如果你自己在本地电脑搞个apache服务，那么这个页面的访问路径是这样的， localhost/wesay/3/html5_1.html 而如果你配置好开发环境之后，把项目跑
跨平台一直是老生常谈的话题，cordova、ionic、react-native、weex、kotlin-native、flutter等跨平台框架的百花齐放，颇有一股推倒原生开发者的势头。（事实上更多是共存发展）看完本篇，相信你会对于当下跨平台移动开发的现状、实现原理、框架的选择等有更深入的理解。
上篇文章(webpack+vue项目实战（一,搭建运行环境和相关配置）)搭建了好了基本的一个项目目录，安好好了一些要用到的依赖，以及把项目跑了起来。接下来，我们就进行第二步的操作，第二步就是做好一个开发系统的主页面，这个页面主要也就是一个侧边栏，通过侧边栏的各个选项来进行操作（切换各个组件）。比如回款管理，订单管理，物流管理等等的操作。
通过webpack的tree-shaking功能，可以将无用模块“剪辑”，仅打包需要的
在移动互联网的时代里，对于一个web站点来说，移动端的用户体验尤为重要。现代web站点的设计和开发都是以移动优先作为第一原则，我们也专门为了移动端的web站点做了相应的优化和提升。而网页的打开速度和页面的流畅度，对于用户是否长时间访问至关重要。我们在移动端的站点通过一系列的方法，最终为了快速打开页面展示网页内容，触达用户，同时能流畅的浏览网页。 移动端的硬件条件，网络条件相对于桌面端，会复杂的多，设备类型多样，硬件配置参差不齐，分辨率碎片化，网络状况在移动过程中稳定性，速率都会变化，而对于一个页面到达用户的
最近刚把Js高级程序设计看了一遍，仔细的读了其中的第6章的第6.3节-继承。今天写出来跟大家分享一下，顺便也加深一下自己的理解。
机器学习的很多算法理论非常枯燥乏味，但有许多有趣且有用的网站，您可以像游戏一样交互式操作，并同时学习机器学习概念、模型和应用知识。以下是 ShowMeAI 为大家整理的18个交互式机器学习网站，快快来一起体验一下吧，好玩又好学。
思维导图是一种常见的表达发散性思维的有效工具，市面上有非常多的工具可以用来画思维导图，有免费的也有收费的，此外也有一些可以用来帮助快速实现的JavaScript类库，如：jsMind、KityMinder。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM
