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

为什么前端监控要用 GIF 打点；一文看尽 2018 全年 AI 技术大突破；「今日头条」前端面试题和思路解析；理解vue ssr原理，自己搭建简单的ssr框架；vue 前端项目技术选型、开发工具、周边生态；补全一段jQuery代码；浅探前端图片优化；webpack自动用svg生成iconfont字体图标，支持热重载

为什么前端监控要用 GIF 打点作者大布（企业代号名），目前负责贝壳找房前端开发工作。 1背景灯塔是贝壳找房前端架构组推出的一款前端监控系统, 最近和业务方对接时, 被问到了这样一个问题：为什么前端监控要用GIF打点? 这个问题很有意思。我们知道，目前主流的前端监控(百度…
一文看尽 2018 全年 AI 技术大突破安妮夏乙发自凹非寺量子位出品 | 公众号 QbitAI 2018，仍是AI领域激动人心的一年。这一年成为NLP研究的分水岭，各种突破接连不断；CV领域同样精彩纷呈，与四年前相比GAN生成的假脸逼真到让人不敢相信；新工具、新框架的出现，也让这个领域的明天特别让人期待…… 近日，Anal…
「今日头条」前端面试题和思路解析作者用一道2017年「今日头条」的前端面试题为引子，分步讲解了最终结果的执行原因。其中涉及到了不少概念，比如异步的执行顺序，宏任务，微任务等等，同时作者限定了执行范围，以浏览器的 event loop 机制为准。…
理解vue ssr原理，自己搭建简单的ssr框架大多数Vue项目要支持SSR应该是为了SEO考虑，毕竟对于WEB应用来说，搜索引擎是一个很大的流量入口。Vue SSR现在已经比较成熟了，但是如果是把一个SPA应用改造成SSR应用，成本还是有些高的，这工作量无异于重构前端…
vue 前端项目技术选型、开发工具、周边生态vue 前端项目技术选型、开发工具、周边生态声明：这不是一篇介绍 Vue 基础知识的文章，需要熟悉 Vue 相关知识主架构：vue, vue-router, vuex UI 框架：element ui, iview, vuetify, vux, mint-ui, vue-material…
补全一段jQuery代码主要思路是，window.$ = jQuery所以window.jQuery要等于一个函数，这个函数接收一个参数，返回一个对象，返回的对象包含两个方法，这两个方法可以添加text文本和添加class类
浅探前端图片优化性能优化是前端开发必不可少的一环，而图片优化又是性能优化中必不可少的一环，但不知道有多少开发者在网页的开发过程中会注意图片的使用，图片使用不当可能会导致网页加载卡顿、网页加载速度慢等问题，这篇文章…
webpack自动用svg生成iconfont字体图标，支持热重载之前生成iconfont字体图标，是用的[链接] 或者是阿里的[链接] ，将UI给的svg图导入来生成。但是一直有个问题，假如需要再次加入几个图标时，又需要重新搞一遍，很麻烦。
2019 – Web开发技术指南和趋势以下内容来自我特别喜欢的一个Youtube频道: Traversy Media 这是一个2019年你成为前端，后端或全栈开发者的进阶指南: 你不需要学习所有的技术成为一个web开发者这个指南只是通过简单分类列出了技术选项我将从我…
Vue 组件实例属性的使用因为最近面试了二、三十个人，发现大部分都还是只是停留在 Vue 文档的教程。有部分连教程这部分的文档也没看全。所以稍微写一点，让新上手的 Vuer 多了解 Vue 文档的其他更需要关注的点。
CSS -webkit-伪元素选择器不再导致整行无效通常，如果选择器链或组中有无效的伪元素或伪类，则整个选择器列表无效。如果伪元素（但不是伪类）具有-webkit-前缀，那么对于Firefox 63+，Blink、Webkit和Gecko浏览器认为它是有效的，而不会使选择器列表无效。
快速全面了解 React 新功能: Suspense 和 Hooks悄悄的, React v16.7 发布了。 React v16.7: No, This Is Not The One With Hooks.
Web运行环境总结1. 页面加载过程 1.1 加载一个资源的过程在浏览器地址栏输入URL 浏览器查看缓存(强缓存) 浏览器解析URL获取协议，主机，端口，path 浏览器组装一个HTTP（GET）请求报文浏览器根据DNS服务器得要域名的IP地址打…
js高程事件通识篇（2）通过上一篇文章，我们了解到了dom事件流，以及事件的处理程序，那么本文带大家了解下dom事件本身，在我们定义一个事件时，这个事件具有很多属性，基于这个属性得到的内容，我们可以进行下一步的逻辑操作。初识dom级事件对象废话不多说，我们直接在codepen的案例中定义一个点击事件，然后看其返回的内容进行分析学…
Underscore.js 源码学习笔记（下）
JavaScript原型链回顾所谓的内置对象指的是： JavaScript 本身就自己有的对象可以直接拿来就用。例如 Array String 等等。 JavaScript 一共有12内置对象函数类型(10个) String Number Boolean Array Function Date RegExp Error Object Event 函数类型有 __proto__ 和 prototype 属性对象类型(2个) Math JSON 对象类…
CSS阶段总结多个块状元素：有三种方式 a、子元素全部设置为display: inline-block;，父元素设置为text-align: center； b、flex布局，父元素display: flex; justify-content: center; c、如果是在多行各自居中，直接给子元素…
关于JavaScript, NPM官方发布了2018年的回顾以及2019年的预测原文标题：This year in JavaScript: 2018 in review and npm’s predictions for 2019本文翻译自NPM官方发布的一份报告。原文链接点击这里
Webpack 是怎样运行的（一） Webpack 是时下最流行的前端打包工具，它打包开发代码，输出能在各种浏览器运行的代码，提升了开发至发布过程的效率。你可能已经知道，这种便捷是由 Webpack 的插件系统带来的，但我们今天先把这些概念放在一边，从简单的实践开始，探索 Webpack 打包出的代码是如何在浏览器环境运行的。简单配置配…
基于webpack4.X从零搭建React脚手架在根目录创建build文件夹，添加一个js文件，命名为webpack.base.conf.js // webpack.base.conf.js 文件 const path = require(‘path’); const DIST_PATH = path.resolve(__dirname, ‘../dist’); module.exports = { entry: { app: ‘./app/index.js’ }, output: { …
react hooks初体验什么是Hooks？Hooks是react即将推出的功能，它允许您在不编写类的情况下使用状态和其他React功能。我的理解就是可以用写无状态组件的方式去编写拥有状态的组件。遗憾的是，正式版16.7.0出了之后并没有hooks，如果…
BaibianJS(百变JS) 快速注入JS 随意跨域 BaibianJS(百变JS) is a little and amazing mini chrome extension!It will help you to inject js and send cross domain xhr request by setting Access-Control-Allow-Origin.百变JS是一个小巧实用的Chrome插件，主要2个功能，1是能帮您任性注入JS，2是通过让您任性跨域！为什么会有BaibianJS 为了注入JS和跨域…
使用Three.js+requestAnimationFrame实现一个3D动态效果最近几天事情很多，学校在教育评估，不能在宿舍待着，因此笔记也就没做了。但对于Three.js的学习还算不错，将其基本的概念算是了解的差不多了。但总是要有成果的，于是经过一番思索总算是搞出了一个3D效果的正方体，算是对这几天不怎么有效率的学习的一个总结。一、动态3D的生成要实现一个3D动态效果，首先要做的…
(24/24) webpack小案例–自己动手用webpack构建一个React的开发环境
Swoole实验室：7-使用Websocket上传文件(1) 平时我们上传文件使用的是HTTP方式上传，今天我来给大家分享一下使用HTML5的websocket方式上传文件，后端使用Swoole的Websocket模块接收处理客户端上传的数据并保存为文件。本文实例是一个基础实例，后面我会专门给大家讲解更复杂更实战的文件上传实例。服务端我们继续使用Swoole实验室： 1-使用Composer构…
ncc: Node.js Compiler Collection 一个 Cli 工具，将 Node 应用的脚本和依赖打包成一个单独的文件。
vuex-stepbystep 经典案例，详细注释一步到位 vue-admin 详细注释，必须手把手做项目系列之（一 vue-admin 详细注释，必须手把手做项目系列之（三）丢到服务器中解决报错麻雀虽小五脏俱全：[项目地址 github.com/whylisa/vue…
【20181223 前端开发周报】vue响应式原理学习（二）— Observer的实现；掌握 RxJS 系列（三）：剖析 Observable；前端工程师的 2018 年总结；那些前端工作中遇到的坑（01）；JavaScript数组遍历：f…详情→
为何选用Vue做MVC架构模式关键词并行开发代码复用关注点分离经典的MVC架构模式 MVC架构模式是经典设计模式中的经典，是一种编程的方法论。具有高度抽象的特征，经典MVC用简单的定义体现出解决复杂通用问题的办法，只有不断思考和体会才能用来解决不同情况下程序设计所遇到的问题。 MVC不能脱离具体的框架而独自存在，把握抽象必须用具…
【20181223 前端开发日报】JavaScript防抖节流原理；JS 总结之原型；css、js阻塞；vuex的基础；Javascript时间构造的诡异；前端技能拾遗；webpack性能榨汁机；JavaScript数据处理之数组操作JavaScr…详情→