-
html 提交表单，图片和文字一起提交，图片存入服务器，图片地址
所属栏目：[资源] 日期：2020-12-14 热度：67
html pre class="has" !DOCTYPE html head meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0" / meta charset="UTF-8"gt; titleTitle/title script src="https://ajax.aspnetcdn.[详细]
-
前端编码规范
所属栏目：[资源] 日期：2020-12-14 热度：87
h3 id="p-1"不规范写法举例 1.?句尾没有分号 var isHotel = json.type == "hotel" ? true : false 2.?变量命名各种各样 var is_hotel;var isHotel;var ishotel; 3.?if?缩写 if (isHotel) console.log(true)else console.log(false) 4.?使用?eval var json =[详细]
-
http-server
所属栏目：[资源] 日期：2020-12-14 热度：172
http-server是基于node.js的一个简单、零配置的命令行web服务器，可以方便实现跨域资源请求， #全局安装： npm install http-server -g； 全局安装后就可以通过命令行来启动了 使用： http- #安装为一个node应用 / - 使用： 本地启动http-server: node bin/h[详细]
-
meta标签
所属栏目：[资源] 日期：2020-12-14 热度：194
本页面的head标签内的meta元素设置如下： > content= > content= > content= > content= > content= > meta基础知识 meta指可提供有关页面的元信息（meta-information),比如针对搜索引擎和更新频度的描述和关键词。标签位于文档的头部，不包含任何内容。标签[详细]
-
rimraf命令 递归删除目录所有文件
所属栏目：[资源] 日期：2020-12-14 热度：174
使用webpack build文件项目时每次都会生成一个dist目录，有时需要把dist目录里的所以旧文件全部删掉， 除了可以使用 命令删除外，还可以使用 命令 rimraf 的作用：以包的形式包装 rm -rf 命令，用来删除文件和文件夹的，不管文件夹是否为空，都可删除 局部安[详细]
-
mkdirp——递归创建目录及其子目录
所属栏目：[资源] 日期：2020-12-14 热度：165
如果要创建目录A并创建目录A的子目录B，没有用-p参数的情况下mkdir会逐个创建目录（mkdir A; mkdir A/B）; 加上参数-p就可以直接创建2个目录mkdir -p A/B( 如果目录A 不存在就创建) mkdirp命令是npm的包，可以代替mkdir -p操作。 intall: npm install mkdirp[详细]
-
页面中图片以背景图形式展示好还是以img标签形式展示
所属栏目：[资源] 日期：2020-12-14 热度：180
img和background-image的异同： img是网页结构层面上的标签，页面中多一个img标签就会多一次http请求，且当我们浏览页面时，img标签作为网页结构的一部分，会在浏览器加载结构的过程中加载。这样有个缺点是，如果图片很大，那么很可能在此图片加载完成之前都[详细]
-
Yahoo！团队经验：网站性能优化的34条黄金法则
所属栏目：[资源] 日期：2020-12-14 热度：184
英文原文： 1、尽量减少HTTP请求次数 （1）合并文件就是通过把所有的脚本放到一个文件中来减少HTTP 请求的方法，如可以简单地把所有的CSS 文件都放到一个样式表中。当脚本或者样式表在不同页面中使用时需要做不同的修改，这可能会相对麻烦点，但即便如此也要[详细]
-
打包工具的核心原理（转自：https://juejin.im/entry/5b223ebd51
所属栏目：[资源] 日期：2020-12-14 热度：123
打包工具就是负责把一些分散的小模块，按照一定的规则整合成一个大模块的工具。与此同时，打包工具也会处理好模块之间的依赖关系，最终这个大模块将可以被运行在合适的平台中。 打包工具会从一个入口文件开始，分析它里面的依赖，并且再进一步地分析依赖中的[详细]
-
页面请求速度慢，TTFB时间长的问题分析
所属栏目：[资源] 日期：2020-12-14 热度：176
线上环境发现用户请求某个页面时，出现请求速度慢页面卡顿白屏的现象，通过chrome开发工具调试查看Timing，花费在waiting(TTFB)上的时间过长，几秒十几秒不等 TTFB全称Time To First Byte，是指网络请求被发起到从服务器接收到地一个字节的这段时间。包含了T[详细]
-
chrome浏览器Network面板请求Timing分析
所属栏目：[资源] 日期：2020-12-14 热度：204
Timing显示资源在整个请求生命周期过程中各部分话费的时间。 Queueing 排队的时间花费。可能由于该请求被渲染引擎认为是优先级比较低的资源（图片）、服务器不可用、超过浏览器并发请求的最大连接数（Chrome的最大并发连接数是6） Stalled(阻塞) 浏览器对同[详细]
-
grid栅格布局
所属栏目：[资源] 日期：2020-12-14 热度：163
之前用来布局的方法： 1、table布局 2、float浮动及 position定位布局，需要考虑对其他元素的影响 3、flex弹性盒模型布局，可以解决排列方向，对齐方式，自适应尺寸的问题 现在学习一种新的布局方法：Grid布局，网格布局。是基于二维网格的布局系统，网格内[详细]
-
深入理解webpack打包机制
所属栏目：[资源] 日期：2020-12-14 热度：150
一、单入口文件如何打包 /src/single/index.js index2 = require( util = require( console.log(index2); console.log(util); /src/single/index2.js util = require( = ; /src/single/util.js module.exports = ; /config/webpack.config.single.js webpack[详细]
-
前端构建之--gulp
所属栏目：[资源] 日期：2020-12-14 热度：160
gulp相关插件： 1、 del 删除文件，用于清空文件 2、 用于自动刷新浏览器 3、 用于压缩html 4、 压缩css 给css属性自动增加浏览器前缀 5、 压缩js 6、 替换路径 7、 将小背景图转换为base64的形式，可以自己设置最大多少尺寸转为base64 8、 压缩图片大小 9、[详细]
-
本地项目上传到github
所属栏目：[资源] 日期：2020-12-14 热度：164
1、进入项目文件夹，使用git init命令把这个项目变成git可以管理的仓库 cd my- 2、把文件添加到版本库中，使用命令git add . 添加到暂存区里面去，后面的小数点“.”，表示添加文件夹下所有的文件 git add . 3、用命令git commit 把文件提交到仓库。 git com[详细]
-
前端开发利器之静态服务器
所属栏目：[资源] 日期：2020-12-14 热度：144
在进行前端页面开发时，为了调试方便，需要在本地启动一个静态文件服务器，而不需要与后端api服务一起部署。 使用简单，需要nodejs环境。安装：npm install anywhere -g使用：anywhere --help在任何需要访问静态文件的地方，直接运行即可访问： anywhere -p[详细]
-
webpack和gulp
所属栏目：[资源] 日期：2020-12-14 热度：119
在没有使用任何自动化工具之前，如果用sass写了css,用coffee写了js,那么我们必须手动用相应的compiler去编译各自的文件，然后各自minify(js,css文件压缩并合并)。这时如果又有两张新图片，那么又需要用自己的小工具手动去压缩图片。于是为了解决前端这种总需[详细]
-
vue-cli + webpack自动生成项目
所属栏目：[资源] 日期：2020-12-14 热度：101
div class="cnblogs_code" # 全局安装 vue- -- vue- 创建过程参考：https://www.2cto.com/kf/201711/695061.html，单元测试选择的是jest 创建好的项目结构如下： 下面就重点分析build和config目录下各个配置文件的解析： config目录下的各项配置都是为了服务[详细]
-
函数去抖（debounce）与 函数节流（throttle)
所属栏目：[资源] 日期：2020-12-14 热度：179
以下场景往往由于事件频繁被触发，因而频繁执行DOM操作、资源加载等重行为，导致UI停顿甚至浏览器崩溃。 1. window对象的resize、scroll事件 2. 拖拽时的mousemove事件 3. 射击游戏中的mousedown、keydown事件 4. 文字输入、自动完成的keyup/keypress事件 实[详细]
-
前端技术在线文档地址链接
所属栏目：[资源] 日期：2020-12-14 热度：139
深入浅出Webpack： http://webpack.wuhaolin.cn/ ECMAScript 6 入门 - 阮一峰：http://es6.ruanyifeng.com/ 阮一峰技术文档：http://www.ruanyifeng.com/blog/javascript/ Angular2.x.x / 4.x.x /5.x.x： https://github.com/angular/angular/blob/master/CH[详细]
-
好用的css库
所属栏目：[资源] 日期：2020-12-14 热度：145
实现元素各种抖动效果：https://elrumordelaluz.github.io/csshake/[详细]
-
WebSocket消息推送
所属栏目：[资源] 日期：2020-12-14 热度：175
WebSocket协议是基于TCP的一种新的网络协议，应用层，是TCP/IP协议的子集。 它实现了浏览器与服务器全双工（full-duplex）通信，客户端和服务器都可以向对方主动发送和接收数据。在JS中创建WebSocket后，会有一个HTTP请求发向浏览器以发起请求。在取得服务器[详细]
-
CSS加载性能优化
所属栏目：[资源] 日期：2020-12-14 热度：92
将首屏页面要用到的CSS文件，放在页面头部加载，其他模块的CSS可以使用异步加载：loadCSS 和 Preload。 关于preload,推进2篇文章给大家看下： 1、通过rel="preload"进行内容预加载： 2、preload 的w3文档： 对于一些不是首屏加载的css，我们可以如下写法： h[详细]
-
网站前端性能优化之javascript和css
所属栏目：[资源] 日期：2020-12-14 热度：166
原文地址：http://www.haorooms.com/post/web_xnyh_jscss[详细]
-
前端——实用UI组件库
所属栏目：[资源] 日期：2020-12-14 热度：191
Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网：https://valor-software.com/ngx-bootstrap/#/ github: https://github.com/valor-software/ngx-bootstrap NG-bootstrap bootstrap4组件 官网：https://ng-bootstrap.github.io/#/home NG-ZORRO 0[详细]
