自定义博客皮肤VIP专享

*博客头图：

格式为PNG、JPG，宽度*高度大于1920*100像素，不超过2MB，主视觉建议放在右侧，请参照线上博客头图

请上传大于1920*100像素的图片！

博客底图：

图片格式为PNG、JPG，不超过1MB，可上下左右平铺至整个背景

栏目图：

图片格式为PNG、JPG，图片宽度*高度为300*38像素，不超过0.5MB

主标题颜色：

RGB颜色，例如：#AFAFAF

Hover：

RGB颜色，例如：#AFAFAF

副标题颜色：

RGB颜色，例如：#AFAFAF

预览 取消 提交

自定义博客皮肤

-+
上一步保存

saucxs

sau交流学习社区（https://www.mwcxs.top）

我也要用
排序：
默认
按更新时间
按访问量
RSS订阅

原创 简单水印（watermark-dom）和算法水印（频域方式图片合并）实现

一、简单水印（watermark-dom） 阿里巴巴内网的不可见水印用的是什么算法？ 据说月饼事件截图的那位员工也被开除了？ 下面的只是简单的加一个很浅的水印，实现起来很容易。 1、看看水印的效果 随便找一个网站，比如就找掘金的个人首页， （1）F12检查模式， （2）在console里粘贴下面的...

2019-04-29 09:32:37 981 0

原创 happyChat开发系列：使用websocket.io实现双向通信的乐聊大前端开发

一、前言 乐聊是一个自己用websocket写一个完整的应用，虽然功能比较欠缺，但是实现了基本的文字聊天，以及群聊，私聊，机器人聊天等功能。因为这个自己做了PC端，无线端（手机端），以及使用cordova打包成一个android的apk。实现了一个大前端的项目，虽然现在android端还是有点有...

2019-04-10 10:39:36 149 0

原创 阿里云服务器：新用户的登陆服务器实例

一、登陆阿里云服务器官网 这个不用多说：https://homenew.console.aliyun.com/ 进入到控制台 二、实例修改root密码 重置实例密码，点击之后 点击修改之后，重新选择vnc登陆 三、使用VNC登陆 第一次登陆VNC登陆，会有给出远程登陆密码...

2020-01-12 21:17:25 343 0

原创 JavaScript系列--深浅拷贝简单实现

一、前言 之前写了一篇：浅析JavaScript解析赋值、浅拷贝和深拷贝的区别：https://www.mwcxs.top/page/592.html。里面介绍了解析赋值，浅拷贝，深拷贝的原理和实现。浅拷贝方法：Object.assign()，展开语法Spread，Array.prototype...

2019-08-24 23:06:19 27 0

原创 【JavaScript系列】时间复杂度和空间复杂度

一、前言 时间复杂度和空间复杂度，我们在大学里的算法与数据结构课程中已经学习过，这回根据项目工作中整理一下，这个估计只是一个粗略的估计分析，并不是一个准确的估计分析。 1、学习时间复杂度和空间复杂度是很有必要的，这个属于算法与数据结构的范畴，学这个是为了解决代码中的“快”和“省”的问题。这样才...

2019-07-30 10:34:54 520 0

原创 【JavaScript系列】类型判断(typeof，instanceof，constructor，Object.prototype.toString)

一、前言 类型判断有时候真的头疼，但是一旦熟练使用就会觉得不过如此。初级的，会判断数字和字符串。中级的，会判断数组和对象。进阶的，会判断日期，正则，错误类型。高级的，会判断plainObject，空对象，window对象等等。 基本类型：String、Number、Boolean、Symbol...

2019-07-25 09:33:26 52 0

原创 【vue系列】项目开发中常用的Vue小技巧--全局注册过滤器，全局组件注册，不同路由的组件复用

一、前言 vue的使用过程中会遇到各种场景，当普通使用时觉得没什么，但是或许优化一下可以更高效更优美地进行开发。下面有一些我在日常开发的时候用到的小技巧 二、全局注册过滤器 1、正常写法 之前我是这么写的过滤器的，在具体页面中。 filters: { roleFilt...

2019-07-23 15:13:09 116 0

原创 【混合App开发系列】Cordova+Vue实现Android APP开发（四）-- 热更新详细教程

一、前言 Cordova+Vue实现AndroidAPP开发（四）--热更新详细教程 二、安装Cordova热更新插件和热更新工具 1、安装Cordova热更新插件 cordova plugin add cordova-hot-code-push-plugin 2、安装Cord...

2019-07-05 09:48:01 783 0

原创 【JavaScript系列】vue项目中实现滚动条（具体视窗口的滚动条）操作：（1）置底，（2）置于上次停留的位置

一、前言 之前写了一个happyChat的项目，主要是想学习一下socketIO的使用。然后最近在给happyChat做前端优化和升级。发现第一版做的很low。 需要优化的问题： 1、问题1：滚动条会出现在头部和底部的视窗中，之前固定头部和固定底部是使用`position:fixed`。 ...

2019-07-05 09:44:39 375 0

原创 【JavaScript系列】深入javascript的主流的模块规范

一、前言 目前主流的模块规范： 1、UMD通用模块 2、CommonJs 3、es6 module 二、UMD模块（通用模块） (function (global, factory) { typeof exports === 'object' &...

2019-07-02 23:06:13 33 0

原创 Cordova+Vue实现Android APP开发（三）-- 设置图标和启动欢迎页详细教程

一、前言 内容是自己查资料和自己进坑出坑，适用于cordova打包android7.0版本以后的版本。我目前使用的是android8.0，android8.1，android9，androidQ等版本。（1）设置图标icon，准备好素材，在配置文件中加入不同尺寸的<icon density...

2019-06-28 21:13:08 880 0

原创 Cordova+Vue实现Android APP开发（二）-- 打包运行在真机上和打包运行在本地调试，以及打包时候一些问题的处理

接上一篇文章：Cordova+Vue实现Android APP开发（一） 一、使用cordova打包运行app 打包静态资源，没有问题的，但是把自己的vue其他项目转成android app时候，发现接口请求不到数据。 1、对axios的统一加一个前缀 2、vue打包 ...

2019-06-27 14:22:42 1105 0

原创 cordova混合App开发：Cordova+Vue实现Android APP开发（一）

一、前言 android开发以前干过，但是一直觉得比较麻烦，缺少分享功能，现在的app大多数是h5的混合开发的app，需要用到原生的android API的时候需要去做兼容，如果是开发速度合并效率，还是混合的H5开发比较受企业的青睐。现在先来自己趟趟水环境配置。 二、下载并安装Androi...

2019-06-26 10:04:26 1430 1

原创 vue+axios+koa 前端后端实现登录拦截--http拦截

一、前言 要想统一处理所有http请求和响应，就得用上 axios 的拦截器。通过配置http response inteceptor，当后端接口返回401 Unauthorized（未授权），让用户重新登录。 二、具体实现 当前端使用localStorage存储登陆信息，但是这个时候，...

2019-06-25 23:13:02 537 0

原创 css系列--纯 CSS 实现绘制各种三角形（各种角度）

一、前言 三角形实现原理：宽度width为0；height为0；（1）有一条横竖边（上下左右）的设置为border-方向：长度 solid red，这个画的就是底部的直线。其他边使用border-方向：长度 solid transparent。（2）有两个横竖边（上下左右）的设置，若斜边是在三角...

2019-06-21 14:47:09 65 0

原创 微信小程序-实现tab选项卡

一、前言 小程序开发中，有很多封装好的控件供开发者使用，但是，很常见的tab选项卡居然没有，只能自己搞一个。 实现原理也很简单，无非是用给view(tab)设置一个点击事件bintap，并且给view(tab)一个data-idx索引，根据当前index来改变tab的状态并决定swiper显示...

2019-06-20 10:20:44 7405 1

原创 css系列--六种实现元素水平居中方法

一、前言 居中效果在CSS中很是普通的效果，平时大家所看到的居中效果主要分为三大类：水平居中、垂直居中和水平垂直居中。而其中水平居中相对于后两者来说要简单得多。使用了css3的flexbox的属性轻松实现多行文本水平垂直居中的方法。当然大家有可能认为这些方法对于浏览嘎嘎的兼容性处理太麻烦了。 ...

2019-06-18 17:49:39 66 0

原创 webpack系列--webpack4.x入门配置基础（一）

一、前言 webpack在不断的迭代优化，目前已经到了4.29.6。在webpack4这个版本中，做了很多优化，引入了很多特性，将获得更多模块类型，.mjs支持，更好的默认值，更为简洁的模式设置，更加智能的chunk，新增的splitChunks来自定义分隔代码块等等。升级待4，在打包速度，代码...

2019-06-17 13:25:15 65 0

原创 懒加载实践--js图片懒加载及优化

一、前言 为啥要对图片使用懒加载？我们首先来聊聊这个问题，对于页面来说架子啊速度影响着最大的就是图片，一张普通的图片可以达到4-5M的大小，而代码压缩也就只有几十KB。当页面图片过多的时候，页面加载速度很缓慢，一个页面加载几秒没有完成，用户体验不好，会丧失很多用户的。 所以对于图片过多的页面，...

2019-06-14 13:38:51 204 0

原创 webAssembly系列--webAssembly初探究竟

一、前言 自从JavaScript诞生开始，到现在开始变成流行的编程语言，背后的是web发展所推动的。web应用的变得更多更复杂，但是渐渐暴露出JavaScript的问题： （1）语法太灵活导致开发大型web项目困难； （2）性能不足满足一些场景的需要。 二、为什么需要WebAssem...

2019-06-14 13:36:58 1402 0

原创 vuex系列--浅析Vuex 的设计思想

一、前言 在聊之前，大家要始终记得一句话：一切前端概念，都是纸老虎。 不管是Vue，还是 React，都需要管理状态（state），比如组件之间都有共享状态的需要。什么是共享状态？比如一个组件需要使用另一个组件的状态，或者一个组件需要改变另一个组件的状态，都是共享状态。 如果不对状态进行有效...

2019-06-14 13:35:01 767 0

原创 vue系列--Virtual DOM 真的比操作原生 DOM 快吗？

一、前言 网上都说操作真实dom怎么怎么慢，这儿有个例子：http://chrisharrington.github.io/demos/performance/，例子循环2000个随机数组，点击按钮重新生成随机数组渲染页面，也是自己用的js 操作dom 比用react 和angular 都要快。...

2019-06-10 14:11:37 619 0

原创 JavaScript数组reduce()方法详解及奇淫技巧

一、前言 reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。 reduce() 可以作为一个高阶函数，用于函数的 compose。 reduce()方法可以搞定的东西，for循环，或者forEach方法有时候也可以搞定，那为啥要用reduce...

2019-06-06 16:06:00 295 0

原创 JavaScript 系列--JavaScript一些奇淫技巧的实现方法（三）数字取整，数组求和

一、前言 简短的sleep函数，获取时间戳：https://www.mwcxs.top/page/746.html 数字格式化 1234567890 --> 1,234,567,890；argruments 对象(类数组)转换成数组： https://www.mwcxs.top/pag...

2019-06-04 21:10:14 79 0

原创 JavaScript 系列--JavaScript一些奇淫技巧的实现方法（二）数字格式化 1234567890到 1,234,567,890；argruments 对象(类数组)转换成数组

一、前言 之前写了一篇文章：JavaScript 系列--JavaScript一些奇淫技巧的实现方法（一）简短的sleep函数，获取时间戳 https://www.mwcxs.top/page/746.html 介绍了sleep函数和获取时间戳的方法。接下来我们来介绍数字格式化1234567...

2019-05-31 14:41:04 66 0

原创 JavaScript 系列--JavaScript一些奇淫技巧的实现方法（一）简短的sleep函数，获取时间戳

一、前言 有些东西很好用，但是你未必知道；有些东西你可能用过，但是你未必知道原理。 实现一个目的有多种途径，俗话说，条条大路通罗马。发散一下大家的思维以及拓展一下知识面。 二、实现一个简短的sleep函数 sleep函数主要用来做延迟执行的，很多编程语言都有sleep函数，但是javas...

2019-05-31 14:37:44 86 0

原创 设计方案--移动端延迟300ms的原因以及解决方案

一、前言 移动端浏览器提供一个特殊的功能：双击(double tap)缩放。 二、移动端延迟300ms的原因 为什么要用触摸事件？触摸事件是移动端浏览器特有的html5事件。 因为移动端的click有很大延迟（大约300ms），300ms延迟来自判断双击和长按，因为只有默认等待时间结束...

2019-05-29 16:44:11 76 0

原创 vue系列--vue是如何实现绑定事件

一、前言 vuejs中的事件绑定，使用<v-on:事件名 = 函数名>来完成的，这里函数名是定义在Vue实例中的methods对象中的，Vue实例可以直接访问其中的方法。 二、事件绑定方式 1、 直接在标签中写js方法 <button v-on:click=&qu...

2019-05-27 22:00:48 2401 0

原创 浅析SSR(服务端渲染)和SPA(客户端渲染)

一、前言 C端项目重构成首屏服务端渲染（SSR：serve side render），对于重构成SSR，redux不是必须的。本文以vue为栗子的项目。 二、什么是服务端渲染 将组件或页面通过服务器生成html字符串，再发送到浏览器，最后将静态标记"混合"为客户端上完...

2019-05-24 17:53:32 3618 1

原创 JavaScript系列--类型判断的4种基本方法，研究jquery的type方法，空对象的检测方法，类数组对象

一、前言 类型判断有时候真的头疼，但是一旦熟练使用就会觉得不过如此。初级的，会判断数字和字符串。中级的，会判断数组和对象。进阶的，会判断日期，正则，错误类型。高级的，会判断plainObject，空对象，window对象等等。 基本类型：String、Number、Boolean、Symbol、...

2019-05-23 11:04:12 26 0

原创 计算机基础系列--从输入 URL 到页面加载完成的详细过程，贯穿整个开发知识体系

一、前言 这道题的覆盖面可以非常广，很适合作为一道承载知识体系的题目。每一个前端人员，如果要往更高阶发展，必然会将自己的知识体系梳理一遍，没有牢固的知识体系，无法往更高处走！ 二、主干流程 在将浏览器渲染原理、JS运行机制、JS引擎解析流程梳理一遍后，感觉就跟打通了任督二脉一样，有了一个...

2019-05-23 10:57:00 50 0

原创 webpack系列--浅析webpack的原理

一、前言 现在随着前端开发的复杂度和规模越来越大，鹰不能抛开工程化来独立开发，比如：react的jsx代码必须编译后才能在浏览器中使用，比如sass和less代码浏览器是不支持的。如果摒弃这些开发框架，开发效率会大幅下降。 在众多前端工程化工具中，webpack脱颖而出成为了当今最流行的前端构...

2019-05-21 09:54:16 169 0

原创 移动端设计方案--如何设计移动端屏适配方案

一、前言 在众多的移动设备中，前端开发人员如何在不同屏幕大小，不同程度的高清屏下去百分百的还原设计稿，从来都不是一件简单的事情，需要考虑众多因素，权衡利弊，做出取舍，结合需求去选择最合适的方案。 之前有一篇：如何设计移动端高清方案 二、面对的问题 在不同大小和高清的屏幕下： （1）如...

2019-05-20 17:55:13 172 0

原创 移动端设计方案--如何更好的设计移动端高清方案

一、前言 有时候需要前端做到移动端高清显示，1、面对开发移动端H5页面，2、面对不同分辨率的手机，3、面对不同屏幕尺寸的手机。 二、视觉稿 前端开发正常是，视觉的小哥哥给我们psd或者导出的skech文件，这个就是视觉稿，然后前端开始写结构，写元素，调整，优化等等。 对于移动端开发而言...

2019-05-18 23:14:11 61 0

原创 HTTP系列--HTTP2.0新特性：二进制传输，多路复用，Haeder压缩，服务端push，QUIC协议

一、前言 HTTP 2.0 相比于 HTTP 1.X，可以说是大幅度提高了 web 的性能。 在 HTTP 1.X 中，为了性能考虑，我们会引入雪碧图、将小图内联、使用多个域名等等的方式。这一切都是因为浏览器限制了同一个域名下的请求数量，当页面中需要请求很多资源的时候，队头阻塞（Head ...

2019-05-18 23:13:03 280 0

原创 V8引擎--浅析Chrome V8引擎中的垃圾回收机制和内存泄露优化策略

V8 实现了准确式 GC，GC 算法采用了分代式垃圾回收机制。因此，V8 将内存（堆）分为新生代和老生代两部分。 一、前言 V8的垃圾回收机制：JavaScript使用垃圾回收机制来自动管理内存。垃圾回收是一把双刃剑，其好处是可以大幅简化程序的内存管理代码，降低程序员的负担，减少因 长时间...

2019-05-16 21:02:45 85 0

原创 计算机基础--http的基础整理和巩固

一、前言 主要包括：1、http基础：TCP/IP，TCP协议，IP协议，DNS协议，URI与URL； 2、http协议：http报文，http方法，http状态码，常见问题 名词解释： （1）HTTP（HyperText Transfer Protocol）超文本传输协议 （2）URL...

2019-05-16 21:01:31 25 0

原创 框架选择--如何看待前端框架选型 ?

对于前端团队，可以实现企业受益最大化要点。 一、技术选型的策略 1、保证产品质量 （1）功能稳健：网页不白屏，不错位，不卡死；操作正常；数据精准。 （2）体验优秀：加载体验，交互体验，视觉体验，无障碍访问。 2、降低人力成本 （1）降低前期开发成本； （2）降低后期维护成本。 ...

2019-05-16 20:59:33 310 0

原创 数据可视化系列--svg入门基础（二）

接上一篇：数据可视化-svg入门基础（一），基础一主要是介绍了svg概念，元素样式设置等。 svg是（scalable vector graphic）伸缩矢量图像。 一、目录 （1）图形元素 （2）文字元素 （3）特殊元素 （4）滤镜元素 （5）渐变元素 二、图形元素 1、矩...

2019-05-15 17:06:42 74 0

原创 数据可视化系列--svg入门基础（一）

一、前言 1、SVG(Scalable Vector Graphics)可伸缩矢量图形 特点： （1）使用xml格式来定义图形； （2）用来定义web上的使用的矢量图； （3）改变图像尺寸，图片质量不受损； （4）所有元素属性可以使用动画； （5）继承了W3C标准，在html中使用方...

2019-05-15 17:05:53 268 0

提示
确定要删除当前文章？
取消 删除