- 博客(37)
- 收藏
- 关注
RSS订阅原创 idea maven web项目新建及web.xml配置
新建web项目配置web-app版本当前web-app的版本为2，版本太低，修改为3.** 找到这个文件，不要解压**<?xml version="1.0" encoding="UTF-8"?><web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocatio
2021-05-16 13:28:37
1458
原创 svn常用命令
检出版本// 检出版本到当前路径svn checkout svn路径 [-r svn版本]添加文件/目录到版本库//添加文件 //文件名可使用通配符svn add 文件名 //添加当前目录svn add * 更新文件/目录// 更新目录svn update// 更新文件[更新指定版本的文件]svn update [ -r version ] 文件名提交文件/目录// 提交当前目录下的文件svn commit -m "备注内容" *// 提交 文件sv.
2021-03-10 13:19:26
187
原创 计算机系统结构-2-01-数据表示-笔记
1. 基本概念数据表示：计算机硬件能够直接识别、指令集可以直接调用的数据类型。所有数据类型中最常用、相对比较简单、用硬件实现比较容易的几种。数据结构： 由软件进行处理和实现的各种数据类型研究：这些数据类型的逻辑结构和物理结构之间的关系并给出响应的算法。系统结构设计者要解决的问题：如何确定数据表示（软硬件取舍折中问题）1.1 数据表示类型1.1.1 定点数据表示当机器设置有定点加、减、乘、除、移位、比较等一系列定点运算指令和相应的运算硬件。可以直接对定点数据进行各种处理时，机器就有了定
2021-03-02 17:40:45
2018
1
原创 05资源优化-03图片加载优化
1. 懒加载1.1 原生懒加载(loading)1.2 第三方图片懒加载方案如：lazy-load-imgsLazy Load比较好的文章：图片懒加载相关文章2. 使用渐进式图片目前主要使用的图片加载方式有两种：线性加载和渐进式加载2.1 线性加载线性加载其实就是在我们浏览网页时常看见的那种 —— 网速足够慢或者图片尺寸过大时，可以看到图片的加载方式由上至下，一点一点的加载。2.2 渐进式加载渐进式 则如同名字一般, 它会先显示低分辨率的近似图像，再逐步的增加图片分辨率(模糊到
2021-03-02 09:24:11
125
原创 05资源优化-02图片格式优化
1. 图片优化的方案1.1 选择正确的格式根据实际的使用方式选择正确的格式。1.2 选择接近的图片尺寸比如：页面需要一个500*500px的图片，那么就给他一个这么大的图片。常见情况：不同的终端显示同一张图片，此时最好就是给他们不同尺寸大小的图片来适配对应终端。1.3 图片压缩图片的压缩要慎重，因为图片进行压缩后会对图片的质量产生较大影响。请平衡好质量和大小。1.4 根据优先级进行加载(其他资源也同理)重要的图片先加载，不重要的后面加载（懒加载）。1.5 利用相关的工具工欲善其事必先利
2021-02-28 14:31:47
161
原创 05资源优化-01资源的压缩与合并
1.HTML 压缩1.1 使用在线工具进行压缩1.2 使用html-minifier等npm工具html-minifier它还提供了在线的压缩（在线压缩）方式；2. css压缩2.1 使用在线工具进行压缩2.2 使用clean-css等npm工具html-minifier也可以压缩css，而且使用的就是clean-css。3. js的压缩与混淆使用webpack等构建工具对js进行压缩。（详情可参考 构建优化 ）4. css 、js文件合并文件合并可避免下载时的网络的多次请求耗时。
2021-02-28 13:59:53
451
原创 04代码优化-01JS开销和如果缩短解析时间
JS的开销相同大小的js和JPEG的总耗时。传输时间基本相同（传输基本上只受文件大小的影响）JS的编译&解析时间 约2s;执行时间 约1.5s，共约3.5sjpeg传输完成后，只有解码和绘制，总共 约0.1s不到加载网络资源的加载速度一般受 网络速度和 资源大小的影响。压缩资源Code Splitting 代码拆分，按需加载Tree Shaking 代码减重编译/解析 and 执行减少主线程的工作量。避免长任务避免超过1KB的行间脚本使用rAF和rIC进
2021-02-27 14:14:32
168
原创 03渲染优化-06高频事件防抖
高频事件(处理函数)在DOM Event的世界中，以oninput、onscroll、onresize、mouseover、touch等为代表的高频触发事件显得有些与众不同。通常，DOM事件只有在明确的时间点才会被触发，比如被点击，比如XMLHttpRequest状态更改等等；而高频事件则是在整个动作时期内反复触发反复调用callback，为整个站点的流畅运行留下了性能隐患这里以oninput为例（element-ui）。业务场景：当在input输入相关的关键字时，请求后台 查询关键字所对应的列
2021-02-27 11:25:39
132
原创 03渲染优化-04复合线程与图层
复合线程（compositor thread） 就是 将页面拆分图层进行绘制后再合并图层利用devTools了解网页的图层拆分情况默认情况下，浏览器会根据他自己的规则来进行图层的拆分。* 打开layers标签页* 查看当前图层页面若有动画，图层个数会随着动画的变化而变动哪些样式仅影响复合不影响回流和重绘。Postion// 指定对象的2D translation（2D平移）。第一个参数对应X轴，第二个参数对应Y轴。如果第二个参数未提供，则默认值为0transform :transla
2021-02-26 16:08:15
226
原创 03渲染优化-03防止布局抖动的利器-fastDOM
fastDOMfastDOM gitee地址fastdom.read(function() { console.log('read');});fastdom.write(function() { console.log('write');});fastdom.read(function() { console.log('read');});fastdom.write(function() { console.log('write');});Outputs:rea
2021-02-26 15:07:27
1346
原创 03渲染优化-02回流与重绘
1.布局(layout)与绘制(paint)在关键渲染路径中，布局和绘制是消耗相对来说比较高的操作。要提升页面性能，尽量避免布局和绘制是很好的方法之一。渲染树只包含网页需要的节点布局：计算每个节点精确的位置和大小绘制：像素化每个节点的过程。1.1回流当render tree中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建。这就称为回流(reflow)。第一次Layout:布局；从第二次开始Layout:回流；1.1.1 影响回流的操作添加/删除元素操作
2021-02-26 14:26:31
126
原创 03渲染优化-01浏览器渲染原理
1. 浏览器的渲染流程JavaScript --> style --> layout --> paint --> composite1.1 浏览器构建对象模型浏览器读取到HTML文档后，会把此文档解析为DOM树。(DOM:文档对象模型)关键渲染路径：从渲染开始到绘制完成的过程。共5个步骤：JavaScript --> Style --> Layout --> Paint --> CompositeJavaScript:通过JavaScrip
2021-02-26 10:24:06
67
原创 02-03RAIL测量模型、webpagetest、Lighthouse-笔记
1. 什么是RAILR: Response响应请求后很快的被响应评估标准：处理事件应在50ms以内完成A:Animation 动画评估标准： 每10ms产生一帧(再粗略一点：60帧每秒)I: Idel 空闲让浏览器有足够的空闲时间【主线程的空闲时间】。只有有了足够的空闲时间，才能保证快速的响应。评估标准： 尽可能增加空闲时间L:Load 加载资源的加载（的时间）评估标准： 在5s内完成内容加载并可以交互内容加载:资源加载、解析、渲染包括网络原因、地理位置等外部因
2021-02-26 09:28:28
326
原创 02-02页面性能指标和优化目标-笔记
性能指标1. 网络指标1.1 打开网络设置1.2 重新载入1.3 资源总览1.4瀑布流1.4.1 横向查看（单个资源明细）1.4.2 竖向查看(资源加载方式)1.5 保存当前执行计划2. Lighthouse2.1 自己家的2.2 别人家的交互体验1. 菜单交互2. 搜索框3. 页面流畅度页面翻页时内容（常见图片、视频等多媒体资源）的显示速度。可以很流畅的展示不被用户嫌弃为目标(可以想象为看电影不卡顿)。3.1 页面监控（FPS）4. 异步请
2021-02-26 09:25:04
145
原创 js中的this对象和箭头函数中的this
简单说，this就是属性或方法“当前”所在的对象。Demo1(一般使用——this：定义时所在的对象（当前所在的对象）)var person = { name: '张三', describe: function () { return '姓名：'+ this.name; }};person.describe()这里的this,是指describe函数所在的对象（即person）。Demo2（方法嵌套返回——this：调用时所在的对象（当前所在的对象））稍微改造下，如下
2021-02-05 22:16:48
594
原创 linux常见目录结构
常用目录：/usr :用户的应用程序安装目录/usr/local: 非包管理器应用程序安装目录；（mac的brew安装会装在此目录下）/usr/sbin: 一些守护进程或者管理员级别的管理程序安装在/usr或者/usr/local下的一些服务程序（如apache，Nginx等）的启停命令一般都会在这个目录下/etc: 配置文件及子目录一些服务（应用程序）的配置文件，一般都可以在这里找到...
2021-02-02 17:46:27
158
原创 Promise对象调用
promise正常调用// 异步方法，返回一个promisefunction asynchronousFun(val){ return new Promise((resolve,reject) => { if(val){ resolve(val); }else{ reject("error"); } })}asynchronousFun("num01").then( res => { return asynchronousFun( res+"::nu
2021-01-23 13:59:36
330
原创 浏览器获取当前经纬度
navigator.geolocation.getCurrentPosition(function geoSuccess(event) { console.log(event.coords.latitude + ', ' + event.coords.longitude);},function geoError(event) { console.log("Error code " + event.code + ". " + event.message);});
2021-01-09 16:37:03
1387
原创 js slice()方法
slice()方法用于提取目标数组的一部分，返回一个新数组，原数组不变。// 语法// start:起始位置,从0开始// end:结束位置(不包括该位置本身的元素)，此参数省略，会一直到原数组结束arr.slice(start, end);//DEMOvar arr1 = ['1','2','3'];var arr2 = arr1.slice(); // 提取整个数组到一个新数组console.log(arr1,arr2);arr2.push('88'); //修改arr2c.
2021-01-06 10:53:30
717
转载 webpack 中，module，chunk 和 bundle 的区别是什么？
webpack 中，module，chunk 和 bundle 的区别是什么？Webpack 有非常多的概念，很多名词长得都差不多。我把这些分散在文档和教程里的内容总结起来，写了一份webpack 中的易混淆知识点，目前看是全网独一份，大家可以加个收藏，方便以后检索和学习。全集链接 ➡️webpack 易混淆知识点前两天为了优化公司的代码打包项目，恶补了很多 webpack4 的知识。要是放在几年前让我学习 webpack 我肯定是拒绝的，之前看过 webpack 的旧文档，比我们内部项目的..
2020-12-27 16:17:08
442
原创 webpack支持的模块类型
1.ECMAScript（静态加载）ES2015 import语句// 模块的整体加载import defaultExport from "module-name";//import命令接受一对大括号，里面指定要从其他模块导入的变量名。大括号里面的变量名，必须与被导入模块（profile.js）对外接口的名称相同import { export1 } from "module-name";import { export1 , export2 } from "module-name";impor
2020-11-12 15:39:46
574
原创 AOP案例
AOP案例即动态代理，在程序运行期间动态的将某段代码切入到指定方法指定位置进行编程的方式。1.导入AOP依赖<!-- https://mvnrepository.com/artifact/org.springframework/spring-aspects --><dependency> <groupId>org.springframework</groupId> <artifactId>spring-aspects<
2020-11-03 17:31:06
119
原创 spring组件添加_01
1.组件注册@Configuration&@Bean给容器中注册组件新建maven工程导入spring-context包新增JavaBean类JavaBean 添加getter、setter、无参构造方法、有参构造方法、toString（）方法新增注入配置文件(方式一：xml配置文件)junit测试（xml bean注入方式）导入junit5 依赖包 <!-- JUnit 5 = JUnit Platform + JUnit Jupiter +
2020-11-03 10:56:11
156
原创 spring bean生命周期及装配
@Bean指定初始化和销毁方法bean的生命周期：bean的创建——初始化——销毁的过程容器来管理bean的生命周期。我们可以自定义初始化和销毁方法；容器在进行到当前生命周期时来调用我们自定义的初始化和销毁方法。1. 指定初始化和销毁方法xml方式<bean id="person" class="bean.Person" init-method="" destroy-method="">注解方式// 初始化方法和销毁方法一定要在bean中定义@Bean(initMethod
2020-11-03 10:48:01
129
原创 spring组件添加_02
@lazy懒加载，针对单实例bean来说。因为单实例bean默认是在容器启动的时候创建。而我们可以通过@lazy-bean设置在容器启动时，不创建对象；而是在第一次使用bean的时候，再来创建对象，并进行相关的初始化；@Conditional按照一定的条件进行判断，满足条件给容器中注册bean。【前提是要添加@Bean,在@Bean的基础上添加@Conditional】参数它接收一个Condition类型的数组，可以把每一个condition类当成一个拦截器（condition类可以自定义，实
2020-11-03 10:42:59
43
原创 mysql样本数据库下载及创建
mysql样本数据库列表下载地址https://dev.mysql.com/doc/index-other.html这里以sakila数据库为例下载zip包，解压，结构如下可以打开【view】查看详细的使用方式。1. 命令行方式mysql> SOURCE C:/temp/sakila-db/sakila-schema.sql;mysql> SOURCE C:/temp/sakila-db/sakila-data.sql;2. 使用数据库工具，我惯用n.
2020-08-26 17:12:36
928
原创 NIO编程--聊天室Demo
服务端代码package main.java;import java.io.IOException;import java.net.InetSocketAddress;import java.nio.ByteBuffer;import java.nio.channels.*;import java.nio.charset.Charset;import java.util.Date;import java.util.Iterator;import java.util.Set;/**
2020-08-26 16:22:49
122
原创 centos 7桥接
wmware设置wmware桥接选择自己的网卡。虚拟机配置选择 “桥接”。主机设置开机后，无法连接网络。要做如下三步设置：第一步: 使用【ip addr】命令 查询物理地址 第二步: vi ifcfg-ens33 ,修改如下两处。第三步: 重启网卡服务。执行命令：service network restart以上3步，即可。...
2020-08-12 14:30:34
158
原创 IntelliJ IDEA 小图标的含义
方法一：SETTING->EDITOR->GRNERAL->GUTTER ICONS方法二：查询IDEA的官网https://www.jetbrains.com/help/idea/symbols.html#breakpoint-icons
2020-08-07 09:48:54
1075
原创 maven和Java的JDK版本不同
添加了JDK14，环境变量配置如下（之前的8也留着，以备切换使用）然后，查询了jdk的版本，因为要使用maven，顺便也查询了下maven的版本。看看，看看，两个JAVA版本不同唉怎么改成一样的呢？1. JDK就是当前要设置的14，没毛病。2. 检查下maven的配置吧，maven/config/setting.xml 搜索JDK就这些，而且还被注释掉了。算了，当他不存在吧。3. 查看下maven的运行脚本（mvn.cmd）搜索JAVA,呵呵，JAV...
2020-08-06 11:03:42
1639
原创 idea springboot项目转maven项目
1. 下载springboot项目（https://start.spring.io/） 指定到idea的工作目录。2. idea会自动加载项目。3. 加载后的项目为普通项目，右侧找不到maven选项。4. 项目右键，选择【add Framework Support】5. 勾选【MAVEN】即可。...
2020-08-06 10:18:05
5136
1
原创 hibernate sql查询转对象
单表查询单表查询，指定输出结果字段（非全部字段）使用addScaler 时，无论sql结果字段多少，都只显示scaler指定的字段连表查询，结果指定A表和B表连表查询，结果指定A表的字段和B表连表查询时，addEntity和addScaler联合使用时，sql中字段要和scaler字段一致，** 如上案例，若sql中使用a.*,则会报错，错误提示，找不到除scaler以...
2020-01-11 11:43:47
375
原创 递归格式化省市区三级联动数据
原数据格式：china-area-data组件下的data.json数据。目标数据格式：依照elementUI的Cascader 级联选择器所需要的options格式。//citysFormat.jsconst fs = require("fs"); var destArr = []; //目标对象 var orginArr = {}; //初始对象fs.readFile("./...
2019-11-18 16:19:35
2552
原创 exports和module.exports的区别
exports导出的是一个实例对象。要调用导出的方法或者属性时，要用当前实例对象去调用。如下述代码中，导出的是builds对象，使用getAllBuilds方法时要调用此方法。exports.jsconst builds = { // Runtime only (CommonJS). Used by bundlers e.g. Webpack & Browserify...
2019-11-12 11:16:04
158
原创 centos8无线桥接主机
virtual box网络配置-修改为“桥接模式”配置静态ip-修改为同主机的ip段修改网络配置文件// 进入网络配置文件位置cd /etc/sysconfig/network-scripts//查看文件列表[liujie@localhost network-scripts]$ lsifcfg-enp0s3//备份配置文件cp ifcfg-enp0s3 ifcfg-enp0...
2019-10-29 14:57:22
556
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人