20191020 前端开发日报

Vue3数据驱动源码解读;【源码分析】Vue的响应数据;从一个简单的 list 组件搞懂 Vue 插槽;七个简单但棘手的 JS 面试问题;JS里面的铠甲合体;深入浅出篇-webpack;从零实现支持洋葱模型中间件的 vuex;完全理解TCP/UDP、HTTP长连接、Websocket、SockJS/Socket.IO以及STOMP的区别和联系

  1. Vue3数据驱动源码解读 DEMO地址 ,先下载DEMO,打开index.html体验一下吧 阅读的时候最好是先把DEMO过一遍,然后带着问题来看这篇文章,不然可能会一脸懵逼 我的DEMO源码简化了非常非常多的代码,所以功能很基础,为了方便把流程先理清楚 不要死抓住细节不放,有些问题放一放,等把握全局之后就可以理解了 可以下载DEMO源码,...
  2. 【源码分析】Vue的响应数据 先讲这样一个过程。 在$mont()的时候,会创建Watcher实例的过程,把Dep.target设置为当前Watcher,然后会开始render,render的时候就会读取到响应数据,从而触发get,只有被观察的数据才配置了get,get执行过程中会创建一个Dep实例,此时有了Watcher和Dep,他们会建立关系。他们建立关系之后,当一旦被观察的数据发生改...
  3. 从一个简单的 list 组件搞懂 Vue 插槽 先假设我们需要实现如下效果,并将其封装成一个组件,当然目的并不是要真的封装组件,而是在这个过程中学习 插槽 的使用以及优化的思路哈: 一看到这个效果,有的小伙伴可能就要说了:这还不简单,反手就是一段代码甩上来 <template> <div> <div>{{ title }}</div> &l...
  4. 七个简单但棘手的 JS 面试问题作者:Dmitri Pavlutin翻译:疯狂的技术咋 原文:[链接] 未经允许严禁转载 在软件开发中,我认为最需要注意的是: 编码面试 有毒的主管或猪队友 不是 JavaScript,this,CSS,IE 浏览器,而是上述两点! 如果你参...
  5. JS里面的铠甲合体 本标题党又回来了,最近在专心研究一些JS基础性的书籍,以期把原理都了解透彻,所以写文章的频率就降了下来。但是今天我必须要来写一下子,为什么呢,因为今天周五!先说明一下JS里面的拆箱与装箱指的是JS封箱和拆箱,已经玩的很六的大佬就不要浪费时间啦,抓紧研究更深的! 引子: 我们来看一下这段简单的...
  6. 深入浅出篇-webpack webpack 是一个前端资源加载/打包工具。 他将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源 一. webpack安装: 安装 node.js —— 要使用webpack,必须确保电脑上存在着node.js这个运行环境 安装webpack —— 在命令行输入命令 npm install webpack -g npm 是 node.js ...
  7. 从零实现支持洋葱模型中间件的 vuex 刚开始看 redux 时候,reducer、store、dispatch、middleware 这些名词都比较难以理解,后面接触了 vuex 就比较好理解了。本章会从零开始实现一个简单版本的状态管理器。方便大家今后理解 vuex 和 redux 的状态管理库的源码 什么是状态管理器 一个状态管理器的核心思想是将之前放权到各个组件的修改数据层的 controll...
  8. 完全理解TCP/UDP、HTTP长连接、Websocket、SockJS/Socket.IO以及STOMP的区别和联系 通过《网络工程》的学习,我们知道TCP/UDP是传输层协议,是应用层协议的基础。 对于编程的语言的学习,我们通常需要掌握 Socket编程 ,而真正理解 Socket编程 与 TCP/UDP协议 的关系,可以说是一个开发者从初级突破到中级的一个最好证明。 实际上 Socket编程 就是所谓的 网络编程 也就是 基于TCP/UDP协议进行...
  9. nodejs常用加密方式 RSA & AES RSA 算法是一种 非对称加密算法 ,即由一个私钥和一个公钥构成的密钥对,通过私钥加密,公钥解密,或者通过公钥加密,私钥解密。其中,公钥可以公开,私钥必须保密。 // 生成一个RSA密钥对: openssl genrsa -aes256 -out rsa-key.pem 2048 // 根据提示输入密码,这个密码是用来加密RSA密钥的,加密方式指定为AES256...
  10. 写一个自用的前端脚手架 在工作中我们会用到很多便捷的脚手架工具,比如Vue的vue-cli,React的create-react-app等。极大的提高了我们的工作效率,那么今天我们就来学学怎么制作一款自用的前端脚手架。 核心依赖 commander 命令行工具 download-git-repo git仓库代码下载 chalk 命令行输出样式美化 Inquirer.js 命令行交...
  11. 客户端请求服务器端通信, Web 编程发展基础|乐字节前面我发布的文章算是把Java初级基础阶段讲完了,接下来小乐将会给大家接着讲Java中级阶段——Javaweb。
  12. 一步一步实现符合A+规范的promise const promise = new Promsie((resolve, reject) => { // ... }) 复制代码 promise的状态 promise有三种状态,pending、fulfilled、rejected。并且状态一旦由初始状态(pending)变为其他状态(fulfilled、rejected)便不能再次更改 promise的执行器 promise的执行器executor是构造函数的function类型的参数,e...
  13. Traefik 2.0 实现自动化 HTTPS 上一篇文章我们实现了 Traefik 2.0 暴露 Redis(TCP) 服务,我们了解到 Traefik 中使用 TCP 路由配置需要 SNI,而 SNI 又是依赖 TLS 的,所以需要配置证书才能正常访问 TCP 服务,其实 Traefik 除了支持我们手动配置 TLS 证书之外,还支持自动生成 TLS 证书,本文就来为大家介绍如何在 Traefik 2.0 中配置自动化 HTTPS 服...
  14. 如何在 Knative 中部署 WebSocket 和 gRPC 服务? 作者 | 冬岛  阿里云容器平台工程师 导读: 虽然说 Knative 默认就支持 WebSocket 和 gRPC,但在使用中会发现,有时想要把自己的 WebSocket 或 gRPC 部署到 Knative 中,还是存在各种不顺利。虽然最后排查发现,大多是自己的程序问题或是配置错误导致的。本文分别给出了一个 WebSocket 和 gRPC ...
  15. Git 删除不必要的 commit 信息 写代码的时候,往往都是写一个功能,然后不断fix bug 提交记录就会变成 以下这种情况 了。。。 commit c99106a39a32f7d2388ef55dbef7126f406089cc (HEAD -> master) Author: xxx <xxxx@xx.com> Date: Wed Oct 16 14:18:13 2019 +0800 fix bug3 commit 055521f18710831df56a5a2d90ba65ac05ac...
  16. Nodejs操作RabbitMq快速上手 一个生产者对应一个消费者 三个角色 Producer Queue consumer Work Queues 工作队列/任务队列 工作队列模型 工作队列(又称任务队列)的主要思想是避免立即执行资源密集型任务,而不得不等待它完成。相反,我们安排任务在以后完成。我们将任务封装 为消息并将其发送到队列。在后台运行的工作进程将...
  17. JavaScript 解构的5个有趣用法[每日前端夜话0xD5] 日前端夜话 0xD5 每日前端夜话,陪你聊前端。 每天晚上18:00准时推送。 正文共:1602 字 预计阅读时间:10 分钟 作者:Patricia Neil 翻译:疯狂的技术宅 来源: dmitripavlutin 如果你查看我的常规 JavaScript 代码,会看到到处都有解构。 读取对象属性和访问数组项...
  18. 由segmentFault前端群,数十位成员打造的IM桌面跨平台开源项目启动项目雏形搭建 我们使用的技术栈:1.Electron 2.React 3.dva 4.Node.js(包含C++插件) 5.mongodb 6.mysql 7.protobuffer 8.grpc 9.ajax 10.Tcp、Udp连接 11.websocket 12.webRTC 13.音视频、文字即时通讯技术 14....
  19. 一文搞清 Javascript 中的「上下文」背景 本文是 「2019年,看了这一份, 再也不怕前端面试了」中的一部分: 参考了之前写过的博客和额外的资料, 分享给大家, 希望能给大家带来一些启发和帮助。 如需转载,请联系作者获得许可。 正文 上下文 是Jav...

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多

原文:20191020 前端开发日报 ,未经许可,禁止转载。
来源:前端开发博客 (http://caibaojian.com/fe-daily-20191020.html)