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

Three.js – 利用 JS 进行图片处理并生成对应粒子图；在JavaScript中理解组合模式；css-flex常见面试题；canvas中的拖拽、缩放、旋转 (上) —— 数学知识准备；2019 JavaScript 新玩法；Learn from React；聊聊 Node.js RPC（二）：服务发现；JS 和 CSS 间战火熊熊，该如何熄灭？

Three.js – 利用 JS 进行图片处理并生成对应粒子图平时需要实现几个的动效来改善无聊的中后台业务带来的负面情绪。概述：利用 JS 以及 Three.js 对下图进行处理来生成对应的粒子图，实例代码。主要分为以下几个步骤 1. 获取对应图像信息首先读取图片，可以利用 document.images 获取页面中 img 的信息。再将 img 绘制到 canvas 画布，利用…
在JavaScript中理解组合模式组合模式就是用小的子对象来构建更大的对象, 将对象组合成树形结构, 以表示 “部分-整体” 的层次结构. 位于底层最小的对象, 我们在这里称为叶对象, 由叶对象组成的组合对象我们称为分支对象, 位于最顶层的根对象在这里我们也称为分支对象. 不过它们只是结构上呈现出父子关系. 组合模式最大的好处可以一致性地对待分…
css-flex常见面试题废话不多说！ flex-内容宽度等分 {代码…} 左右布局，一侧定宽，一侧自适应撑满 {代码…} 未知高宽上下左右居中 {代码…} 这个效果就不展示了，可以做到未知宽高，和已知宽未知高的居中效果。
canvas中的拖拽、缩放、旋转 (上) —— 数学知识准备最近做了一个移动端活动页的需求，大概就是diy一个页面。用户可以对物料进行拖动、缩放、旋转，来达到diy的目的。用DOM来实现是不现实的，我采用了canvas来实现和用户的交互。开发过程中，涉及到了canvas中对物料…
2019 JavaScript 新玩法原文作者：David Neal 原文链接： What’s New In JavaScript in 2019 在过去的一些年里，JavaScript 一直凭借着新的语言特性稳定发展。如果你对 JavaScript 的下一个版本充满期待，那么这篇文章正好是为你准备的！在我们讨论这些最新特性之前，了解那些新的想法如何成为 JavaScript 语言的一部分…
Learn from ReactSymbol.for(‘react.element’)用字符串’react.element’产生一个symbol类型的值，symbol类型的值一般用作对象的匿名属性。
聊聊 Node.js RPC（二）：服务发现前言 Nodejs 在蚂蚁和阿里已经发展了四、五年时间，从最开始「前端工程师的玩具」，到 Web、BFF 场景的破局，逐步走到线上甚至是一些核心业务，非常不容易。回头想想 Nodejs 为什么能活下来？依靠的绝不仅仅是：非阻塞I/O、事件驱动、轻量这些官方宣传的特性，我认为更重要一点是我们打通了和 Java 的桥梁，实…
太长不看版：有许多人同时热爱着 JS 和 UX/CSS/etc. 如果我们不再给别人贴上“JS 开发者”或“UX…
手把手实现图片懒加载+封装vue懒加载组件 1、为什么要懒加载或者预加载图片对页面加载速度影响非常大当页面图片比较多，加载速度慢，非常影响用户体验思考一下，页面有可能有几百张图片，但是首屏上需要展示的可能就一张而已，其他的那些图片能不能晚一点再加载，比如用户往下滚动的时候…… 这是为什么要用懒加载的原因那预加载呢？这个非常语义化…
Vue-Cli3多页面配置与编译时构建优化项目中分别有 new_years_festival 和 spring_festival 两个页面， index.js 为页面入口文件（必须）， config.json 为多页面配置文件(必须 )。 2.2 优化前构建效果说明： a. 两个页面公共的第三方库都被打包在 chunk-vendors.js 文件中，库越多、页面越多，这个vendor就越庞大。 b. …
使用 Webpack 进行生产环境配置（附 Demo）本文从代码压缩、代码拆分、样式分离等三个方面对生产环境的代码进行了优化。只是最简单的一些配置，如果真正运用到项目中，还需要根据项目添加更多配置。前言本文讲述的是如何对生产环境下的代码进行压缩，如果还不是太了解 Webpack 的朋友，可以先看一下我的上一篇文章：从零开始搭建一个 Webpack 开发环境配…
前端小报 – 201901 月刊2019 年伊始，GitHub 正式宣布开放无限制创建私有存储库，并开始提供统一的企业版 GitHub 服务，微软正在开始加速 toB 企业服务的布局。开发者们一片叫好声，可谓年度最佳的程序员福利了。
Vue 源码解读-数据响应系统 data 对象初始化通过 vm.$options.data 函数获取 data 对象校验 data 对象是否为纯对象检验 data 对象与 props 对象冲突键检验 methods 对象与 data 对象冲突键 …
【20190202 前端开发日报】JavaScript sort() 排序的坑详解；JavaScript专题系列-防抖和节流；距离最好的编程语言，JavaScript 还缺些什么？；前端路由跳转基本原理；JS手写状态管理的实现；简单聊…详情→
一个收集 JS 框架，Web 组件库和管理模板的项目 Awesome UIKit Collect JS Frameworks, Web components library and Admin Template. Contents Frameworks The Big Three Historically Significant Notable Mobile Wechat …
通过讲故事搞定前端网络知识有人说，前端工程师的网络基础很弱，说很多都是非计算机的，门槛低，其实不能一概而论。但是既然人家吐槽了，那我们就提高自己呗。没有规矩，不成方圆前端工程师对这句话应该有比较深刻的感受吧，这也可能是前端变化真的太 TM 的快了。但变化的这么快，总是要沉淀下来一些规矩吧，不然的话还能不能过了。那…