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

Vue面试中，经常会被问到的面试题/Vue知识点整理；JavaScript之Web Worker；Web 安全漏洞之 SSRF；2018 前端常见题汇总；搭建Websocket简易聊天室；Vuex 源码深度解析；JavaScript 初学者教程（指南）；原来JavaScript的闭包是这么回事

Vue面试中，经常会被问到的面试题/Vue知识点整理看看面试题，只是为了查漏补缺，看看自己那些方面还不懂。切记不要以为背了面试题，就万事大吉了，最好是理解背后的原理，这样面试的时候才能凯凯而谈。不然，稍微有水平的面试官一看就能看出，是否有真才实学还…
JavaScript之Web Worker Web Worker为Web内容在后台线程中运行脚本提供了一种简单的方法。线程可以执行任务而不干扰用户界面。此外，他们可以使用XMLHttpRequest执行 I/O (尽管responseXML和channel属性总是为空)。一旦创建，一个worker 可以将消息发送到创建它的JavaScript代码, 通过将消息发布到该代码指定的事件处理程序（反之亦然）。 W…
Web 安全漏洞之 SSRF 什么是 SSRF 大家使用的服务中或多或少是不是都有以下的功能：通过 URL 地址分享内容通过 URL 地址把原地址的网页内容调优使其适合手机屏幕浏览，即所谓的转码功能通过 URL 地址翻译对应文本的内容，即类似 Google 的翻译网页功能通过 …
#前端技术#【2018 前端常见题汇总】详见：一大波前端面试题来袭，涉及算法、HTML、CSS、JS、VUE 等问题与解答。
搭建Websocket简易聊天室本文，我们通过Egret和Node.js实现一个在线聊天室的demo。主要包括：聊天，改用户名，查看其他用户在线状态的功能。大致流程为，用户访问网页，即进入聊天状态，成为新游客，通过底部的输入框，可以输入自己想说的话，点击发布，信息呈现给所有在聊天的人的页面。用户可以实时修改自己的昵称，用户离线上线都会实时广播…
Vuex 源码深度解析该文章内容节选自团队的开源项目 InterviewMap。项目目前内容包含了 JS、网络、浏览器相关、小程序、性能优化、安全、框架、Git、数据结构、算法等内容，无论是基础还是进阶，亦或是源码解读，你都能在本图谱中得到满意的答案，希望这个面试图谱能够帮助到大家
JavaScript 初学者教程（指南）JavaScript 是前端开发者使用的主要编程语言，随着前端技术的发展，这门语言的边界也得以不断扩展。我们在这里选择了与 JavaScript 相关的经典文章，可以让大家对如何学习这门语言有一些全面的认识。特别的，我们…
【原来JavaScript的闭包是这么回事！】正如标题所述，JavaScript 闭包对我来说一直是个谜。我阅读过很多篇相关文章，我在工作中也使用了闭包，有时候我自己使用了闭包却不自知。最近我参加了一个讲座，在那儿终于有人给我解释清楚了。详见
Git指令大全git config –global user.name “githelper”git config –global user.email githelper@gmail.com
可视化埋点技术揭秘：流程四步走，包含WebSocket通信以及具体埋点过程关于可视化埋点的介绍，易观在前几期已经给大家介绍过几篇，此篇为结合易观的应用场景，在具体的实现技术细节以及交互流程方面给大家做一下介绍。 ▌可视化埋点的具体流程首先手机APP嵌入开启可视化功能的SDK，通过WebSocket的方式和服务器、前端进行相互通信，SDK会定时收到服务器下发的页面请求；然后会上报页面快…
前端优化：浏览器缓存技术介绍 0 前言在前端开发中，性能一直都是被大家所重视的一点，然而判断一个网站的性能最直观的就是看网页打开的速度。其中提高网页反应速度的一个方式就是使用缓存。缓存技术一直一来在WEB技术体系中扮演非常重要角色，是快速且有效地提升性能的手段。一个优秀的缓存策略可以缩
JavaScript中Array方法的正确打开方式在过去的几个月，我发现我的拉取请求中存在四个完全相同的 JavaScript 错误。于是我写了这篇文章，总结了如何在 JavaScript 中正确使用地使用 Array 的方法！用 Array.includes 代替 Array.indexOf “如果你要在数组中查找元素，请使用 Array.indexOf”。我记得在学习 JavaScript 的时候，在教材中读到这样的一句话。…
CSS 变量和 JavaScript 让应用支持动态主题大家好！在这篇文章中我准备讲一讲我在 Web 应用中创建动态主题加载器的方法。我会讲一点关于 React、Create-React-App、Portals、Sass、CSS 变量还有其它有意思的东西。如果你对此感兴趣，请继续阅读！我正在开发的应用是一个音乐应用程序，它是 Spotify 的迷你克隆版。前端代码基于 Create-React-App 。添加了 no…
前端每日实战：131# 视频演示如何用纯 CSS 创作一把剪刀效果预览按下右侧的“点击预览”按钮可以在当前页面预览，点击链接可以全屏预览。 [链接] 可交互视频此视频是可以交互的，你可以随时暂停视频，编辑视频中的代码。请用 chrome, safari, edge 打开观看。 [链接] …
聊聊我对现代前端框架的认知编者按：本文作者 Berwin，W3C性能工作组成员，360导航高级前端工程师。Vue.js早期用户，《深入浅出Vue.js》（正在出版）作者。最近看到一篇国外的文章，说现代JS框架存在的根本原因是保持UI与状态同步、这其实与我这篇文章的思想是一致的，同时
VuePress 手摸手教你搭建一个类Vue文档风格的技术文档/博客VuePress是尤大为了支持 Vue 及其子项目的文档需求而写的一个项目，VuePress界面十分简洁，并且非常容易上手，一个小时就可以将项目架构搭好。现在已经有很多这种类型的文档，如果你有写技术文档的项目的话，VueP…
用作用域插槽和偏函数编写高复用 Vue 组件 TL;DR: 如果你觉得文字啰嗦，直接拉到底部看源码。引言作用域插槽是 Vue 2.1 之后引入的一种组件复用工具。其原理类似 React 里面的 Render Props 组件设计模式。如果你使用过 Render Props，那么你不仅可以很快理解作用域
一统江湖的大前端（5）editorconfig + eslint——你的代码里藏着你的优雅《一统江湖的大前端》系列是自己的前端学习笔记，旨在介绍javascript在非网页开发领域的应用案例和发现各类好玩的js库，不定期更新。如果你对前端的理解还是写写页面绑绑事件，那你真的是有点OUT了，前端能做的事情已经太多了, 手机app开发 , 桌面应用开发 , 用于神经网络人工智能的库 , 页面游戏 , 数据可视化 , 甚至 …
【前端性能】Web 动画帧率（FPS）计算 – ChokCoco – 博客园简单明了，记录下来，方便查阅。
Yii2结合Workerman的websocket 1、安装workerman composer require workerman/workerman 2、启动workerman 创建commands/WorkermanWebSocketController.php文件创建actionIndex()函数，用来启动，代码如下 public function actionIndex() { if (‘start’ == $this->send) { try { $this->start($this-…
redux真的不复杂——源码解读前言阅读对象：使用过redux，对redux实现原理不是很理解的开发者。在我实习入职培训的时候，我的前端组长就跟我说过，redux的核心源码很简洁，建议我有空去看一下，提升对redux系列的理解。入职一个多月了，已经参与了公司的不少项目，redux也
原生js设计表单验证插件的思路分析这几天在做一个用原生js写的项目，需要用到表单验证的功能。因为之前公司项目中的表单验证是写在业务里的，改起来特别的麻烦，就想自己写一个表单验证的小工具。本来想在网上找一个教程研究研究的，但没找到太好的，最后决定自己研究吧。文中示例的代码都是我自己写的demo，并没有参考一些框架或者库的源码，所以代码可…
webpack性能优化不完全指北   前语–最近公司新开了一个项目，对webpack的性能上产生了不小需求，在一通学习了webpack之后特意写一篇来总结一下。 本文涉及的内容体积优化依赖按需加载剔除不必要的依赖  体积的大小直接关系到我们项目的加载速度，而S
Vue: scoped 样式与 CSS Module 对比原文： Vue.js – Scoped Styles vs CSS Modules 作者： Michał Sajnóg 发表时间：Aug 28, 2018 译者：西楼听雨发表时间： 2018/9/10 ( 转载请注明出处 ) 译者按：本文讲解的主要是 Scoped 样式和 CSS Module 的对比，对这两个概念已经熟悉的同…
Webpack 核心模块 tapable 解析原文出自：https://www.pandashen.com 前言 Webpack 是一个现代 JavaScript 应用程序的静态模块打包器，是对前端项目实现自动化和优化必不可少的工具，Webpack 的 loader（加载器）和 plugin（插件）是由
webview布局适配实践一、相关概念 1、viewport：移动设备（包括webview）用来显示网页的那一块区域； 2、devicePixelRatio属性(别名像素比，简称dpr)：window.devicePixelRatio =物理像素 / 独立像素(css中的px)； 3、
【GitHub已完全弃用jQuery，问题是为什么？】这篇文章将介绍过去我们是如何依赖上 jQuery 的，随着时间地推移，我们意识到不再需要它，但到最后我们并没有使用另一个库或框架取代它，而是使用标准的浏览器 API 实现了我们所需要的一切。
精读《REST, GraphQL, Webhooks, & gRPC 如何选型》每当项目进入联调阶段，或者提前约定接口时，前后端就会聚在一起热火朝天的讨论起来。可能 99% 的场景都在约定 Http 接口，讨论 URL 是什么，入参是什么，出参是什么。
DvaJS的学习之路2 – umi@2 + dva，完成用户管理的 CURD 应用前言最近一个月来使用 dva 对公司存量项目进行重构，比较少时间写文章了。随着9月开学季节的到来，最近在使用的几个开源项目都迎来了重大更新。首先就是 umi 终于迎来了 2.0 版本，具体介绍可以查看发布 umi 2.0，可插拔的企业级 react 应用框
Go 语言 HTTP/2 探险之旅女主宣言大家都知道，Go的标准库HTTP服务器默认支持HTTP/2。那么，在这篇文章中，我们将首先展示Go的http/2服务器功能，并解释如何将它们作为客户端使用。 PS：丰富的一线技术、多元化的表现形式，尽在“HULK一线技术杂谈”，点关注哦！在这篇文章中，我们将首先展示Go的http/2服务器功能…
svg、canvas、css3d实现数据可视化（伪3D效果）前言：这次项目用到了一些自定义的数据可视化组件，我把我做的部分抽出来几个典型做个汇总。分为如下：星球环绕旋转图 — 方法一： svg：animateMotion+ animateTransform 方法二：css3d地图 — svg渲染 + div悬浮框