20190428 前端开发日报-前端开发博客

一名【合格】前端工程师的自检清单；websocket通讯原理；JavaScript 中的垃圾回收和内存泄露如何处理？| 技术头条；Web 安全学习笔记；JavaScript系列之类型判断；(下篇)中高级前端大厂面试秘籍，寒冬中为您保驾护航，直通大厂；为什么HTTPS比HTTP更安全?；CSS 自定义属性及其用法

一名【合格】前端工程师的自检清单前端开发是一个非常特殊的行业，它的历史实际上不是很长，但是知识之繁杂，技术迭代速度之快是其他技术所不能比拟的。
websocket通讯原理在websocket没有出现之前，总会有一些需求，需要获取数据，但是这些数据却不知道哪个时间点才能获取到，于是，大家使用了轮询来解决服务器推送的问题。 HTTP协议只能从客户端发出请求，服务器处理返回请求（这里可以看下图），但是服务器不能主动给客户端发送请求，于是解决服务器推送的问题，就只能靠轮询了。 …
JavaScript 中的垃圾回收和内存泄露如何处理？| 技术头条作者 | 浪里行舟责编 | 郭芮程序的运行需要内存。只要程序提出要求，操作系统或者运行时就必须供给内存。所谓的内存泄漏简单来说是不再用到的内存，没有及时释放。为了更好避免内存泄漏，我们先介绍Javascript垃圾回收机制。在C与C++等语言中，开发人员可以直接控制内存的申请和回收。但是在Java、C#、Jav…
Web 安全学习笔记 Contents: 1. 基础知识 1.1. Web技术演化 1.2. 计算机网络 1.3. 域名系统 1.4. HTTP标准 1.5. 代码审计 1.6. WAF 2. 信息收集 2.1. 域名…
JavaScript系列之类型判断类型判断在 web 开发中较为常见，简单的有判断数字还是字符串，判断是数组还是对象稍微复杂一些，再复杂一点的有判断日期、正则、错误类型，再再复杂一点还有比如判断 plainObject、空对象、Window 对象等等。通过本文，我将尝试概述Javascript中类型判断的几种方法（基于ES5的规范）。 typeof typeof判断类…
(下篇)中高级前端大厂面试秘籍，寒冬中为您保驾护航，直通大厂本篇文章会继续沿着前面两篇的脚步，继续梳理前端领域一些比较主流的进阶知识点，力求能让大家在横向层面有个全面的概念。能在面试时有限的时间里，能够快速抓住重点与面试官交流。这些知识点属于加分项，如果能…
为什么HTTPS比HTTP更安全?近几年，互联网发生着翻天覆地的变化，尤其是我们一直习以为常的HTTP协议，在逐渐的被HTTPS协议所取代，在浏览器、搜索引擎、CA机构、大型互联网企业的共同促进下，互联网迎来了“HTTPS加密时代”，HTTPS将在未来的…
#前端技术#【CSS 自定义属性及其用法】详见：在本文中，作者详细介绍了 CSS 自定义属性的用法，以及其所具备的一些优势，供大家参考与学习。（作者：verymuch）
技术栈：为什么 Node 是小菜前端团队的核心技术栈著作权归作者所有。商业转载请联系 Scott 获得授权，非商业转载请注明出处[务必保留全文，勿做删减]。
JavaScript系列之内存空间对于很多没经验的前端开发来说，觉得JS反正有垃圾回收机制，很容易忽视内存空间的管理，这其实是一个大错误。直到最近，看了阮一峰老师关于JS内存泄漏的文章，才发现自己以前写的代码，存在许多内存泄漏的问题，再者，因为忽略对内存空间的学习，导致后面很多进阶概念很模糊，比如闭包、作用域链，比如深拷贝与浅拷贝…
auto-vue-file:一个自动创建vue组件的包 1: 我们在写 xxx.vue 页面文件的时候，一般都要写这些重复的代码： <template> <div class="zlj-comp-ct"> zlj组件 </div> </template> <script> export default { name: ‘zlj’ } </script> <style lang="scss" scoped> .zlj-comp-ct { } …
vue全家桶+Echarts+百度地图，搭建数据可视化系统本文章篇幅略长，内容有点多大佬可根据目录选择性查阅新人可一步步来阅读 1 前言 1.1 业务场景突然接到产品说要做一个数据监控的系统。有线图、柱状图、地图，类似于数据可视化的方式。本人之前从未接触过 Echarts ，然后需要2周拿出成果，有点慌:joy::joy: 1.2 业务分析拿到需求看了一下支持…
Vue源码探究-虚拟DOM的渲染在虚拟节点的实现一篇中，除了知道了 VNode 类的实现之外，还简要地整理了一下DOM渲染的路径。在这一篇中，主要来分析一下两条路径的具体实现代码。按照创建 Vue 实例后的一般执行流程，首先来看看实例初始化时对渲染模块的初始处理。这也是开始 mount 路径的前一步。初始包括两部分，一是向 Vue 类原…
golang实现一个简单的websocket聊天室基本原理： 1.引入了 golang.org/x/net/websocket 包。如需使用，可能要科学上网。 2.监听端口。 3.客户端连接时，发送结构体： {"type":"login","uid":"我是用户名","msg":"登陆成功"}’ .服务端根据login信息，维护一个map，用来存放不同用户的连…
“深拷贝” 与 “浅拷贝” 的区别，JS实现深浅拷贝的几种方法一、 “深拷贝” 与 “浅拷贝” 的区别对于这个问题，可以考虑从深拷贝和浅拷贝的使用或者起源说起，也就是为什么会出现这个问题。首先了解一些javascript的基本知识。【1】javascript变量包含两种不同数据类型的值：基本类型和引用类型。 ①基本类型值指的是简单的数据段，包括es6里面新增的一共是有6种，具体…
Promise扫盲 then 函数可以 return 另一个 promise ： const p1 = new Promise((resolve, reject) =>{ resolve(‘p1’) }) const p2 = new Promise((resolve, reject) =>{ setTimeout(() =>{ resolve(‘p2’) },3000) }) p1.then(res => { console.log(res) return p2 }).then(res =>{ …
Vue使用Canvas绘制图片、矩形、线条、文字，下载图片由于浏览器的机制，使用window.location.href下载图片时，并不会保存到本地，会在浏览器打开。
深入了解Vue响应式系统前言前面几篇文章一直都以源码分析为主，其实枯燥无味，对于新手玩家来说很不友好。这篇文章主要讲讲 Vue 的响应式系统，形式与前边的稍显不同吧，分析为主，源码为辅，如果能达到深入浅出的效果那就更好了。什么是响应式系统「响应式系统」一直以来都是我认为 Vue 里最核心的几个概念之一。想深入理解 V…
【JS基础】一文看懂前端模块化规范前端的模块化之路经历了漫长的过程，想详细了解的小伙伴可以看浪里行舟大神写的前端模块化详解(完整版)，这里根据大佬们写的文章，做了汇总和整理，希望读完的小伙伴能有些收获。
TypeScript 、React、 Redux和Ant-Design的最佳实践阿特伍德定律，指的是any application that can be written in JavaScript, will eventually be written in JavaScript，意即“任何可以用JavaScript来写的应用，最终都将用JavaScript来写”在使用新技术的时候，切…
一文读懂 WebRTC 的视频统计信息之延迟、抖动与丢包一、前言这篇文章主要想说明的是WebRTC内部对视频上下行延时、抖动、丢包如何更新，上层又怎么获取到这些统计信息的。对应的WebRTC版本：63。二、背景最近在内网情况下测试视频会议，视频下行延时很大，很多时候超过100ms。另外，视频的上下行抖动总是稳定在30~40ms这个区间。这些统计…
dom节点和vue中template浅谈前言：在开发前段页面使用vue时，我们能经常看到template标签。这里粗略讲下自己对vue中template理解和使用。 1. 先了解vue vue.js是一个轻巧、高性能、壳组件画的MVVM库。 Vue的两大特征：响应式编程、组件化 vue的优势：轻量级框架、简单易学、双向数据绑定、组件化、视图、数据和结构分离、虚拟DOM…
Vue-Cli3插件实战一：vue-cli-plugin-dll vue-cli3 版本的发布距今已经过了大半年，前后迭代了50多个版本，终于趋于稳定；这里不得不得感叹vue开源团队对vue技术栈的倾力贡献，使得vue社区的前端工程化实践又向前迈了一大步。相比 vue-cli2 版本的’大锅混’，三版本的插件系统卓识令人惊艳了一把，因此组内也在第一时间迁移了 vue-cli3 ，本文算是对插件系…
Vue-CLI and Leaflet (1) 本文将讲述在 Vue.js 的工程中结合 leaflet.js 开发地图相关的功能。要求读者具备一定的 Vuejs 与 leafletjs背景知识。在 Vue.js 中使用 Leaflet 在这个主题下，我将会把自己在实际工作中所学习收获到开发经验分享给读者，总结归纳出常见的地图功能的实现示例，以供读者参考。首先对 Vue.js 和 Leaflet 做简要的介绍。 …
技术栈：小菜前端的技术栈是如何规划和演进的Scott 近两年无论是面试还是线下线上的技术分享，遇到许许多多前端同学，由于团队原因，个人原因，职业成长，技术方向，甚至家庭等等原因，在理想国与现实之间，在放弃与坚守之间，摇摆不停，心酸硬抗，大家可以…
JavaScript（4）之——前端模块化谈谈对前端模块化的理解是面试时经常会被问到的问题，我以面试者的口吻来写了如何分步骤回答这道问题。第一步：模块化是什么？将一个复杂程序安装一定的规则封装成几个块儿，并组合在一起。块的内部，数据和函数实现是私有的，只像外部暴露出来一些接口与外部的其他模块通信。第二步：模块化的发展全局f…
如何在不暴露源码情况下定位前端脚本错误的最小版前端监控系统你可以在我的博客看到详细的开发过程： https://github.com/huruji/blog/issues/63 使用模拟部署 cd client npm run deploy 打开服务器 cd server node app 打开 CDN 服务器 cd cdn-server node app 打开监…
使用Daruk和TypeScript构建你的Nodejs应用
一行一行手敲webpack4配置一、webpack4–基本配置这一部分通过webpack的基本配置，使用loader对图片和样式进行打包，从而了解webpack4简单的用方法，保证自己能够配置正确，提升学习动力。 1.初始化配置 mkdir webpack4 cd webpack4 mkdir demo1 cd demo1 npm init -y 或 npm init 目录结构 webpack4 ├── webpack4/demo1 │ └── webp…