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

RCTF2018 Web Writeup；你不懂js系列学习笔记-异步与性能- 05；Node.js 10.2.0 发布，功能改进和 Bug 修复；超简单的前端跨域、前后端分离解决方案；如何正确的(?)利用 Vue.mixin() 偷懒；Vue项目中路由动态传参功能相关实现；再说 Vue SSR 的 Cookies 问题；不借助Echarts等图形框架原生JS快速实现折线图效果

RCTF2018 Web Writeup RCTF刚好赶上了完成毕设的时间，没办法只接触了部分题目，可惜的是，其中很多题目都不是特别有意思，这里只整理部分我参与的.. r-cursive LUL dat font http://r-cursive.ml hint: If you get stuck after arbitary code execution, try to escape the sandbox. phpinfo may help you figure out how the sandbo…
你不懂js系列学习笔记-异步与性能- 05 原文： You-Dont-Know-JS 这本书至此一直是关于如何更有效地利用异步模式。但是我们还没有直接解释为什么异步对于 JS 如此重要。最明显明确的理由就是性能。举个例子，如果你要发起两个 Ajax 请求，而且他们是相互独立的，但你在进行下一个任务之前需要等到他们全部完成，你就有两种选择来对这种互动…
Node.js 10.2.0 发布，功能改进和 Bug 修复 Node.js 10.2.0 已发布，这是针对 10.x 系列的第二个维护版本，包含一些改进和修复。主要亮点： addons: Fixed a memory leak for users of AsyncResource and N-API. (Michael Dawson) #20668 assert: The error parameter of assert.throws() can be an …
超简单的前端跨域、前后端分离解决方案 LiveNode是一个基于Node.js轻巧的web服务，帮助前端开发者解决本地跨域，代码刷新，以及SPA(单页应用)前后端服务分离，并且可以用于生产环境项目部署。 Github地址安装全局安装livenode脚手架工具 npm install livenode-cli -g 初始化创建项目 livenode init 根据提示输入项目文件名称(不输…
如何正确的(?)利用 Vue.mixin() 偷懒最近开发的页面以及功能大都以表格为主，接口获取来的 JSON 数据大都是需要经过处理，比如时间戳需要转换，或者状态码的转义。对于这样的问题，各大主流框架都提供了类似于过滤的方法，在 Vue 中，一般是在页面上定义 filter 然后在模板文件中使用 | 进行处理。这种方法和以前的遍历数组洗数据是方便…
Vue项目中路由动态传参功能相关实现这两天在项目中有个新需求：在当前页面中的有很多数据，过滤数据的条件有时间，页码，类型，id搜索….，假设我在页面中选择的某段时间，某个类型，现在我需要把握当前看到的信息完全展现给另一朋友。 server端环境：时间和页码可以动态的传递到后端一. 初步解决方案刚看此需求首先想到的是vue—router的动态传参，…
再说 Vue SSR 的 Cookies 问题一个网站一旦涉及到多用户, 就很难从 Cookies 中逃脱, Vue SSR 的 cookies 也真算是遇到的一个不小的问题, 从开始玩 SSR 开始到现在, 一共想出了3种方案, 从最早的把 Cookies 注入到 state 中, 到把 Cookies
不借助Echarts等图形框架原生JS快速实现折线图效果这篇文章发布于 2018年05月25日，星期五，02:01，归类于js实例。阅读 34 次, 今日 34 次 byzhangxinxu from http://www.zhangxinxu.com/wordpress/?p=7605 本文可全文转载，但需得到原作者书面许可，同时保留原作者和出处，摘要引流则随意。一、折线图效果预览例如下图所示的折线图效果实现就很简单： …
最后说 Vue2 SSR 的 Cookies 问题本来想前面写点什么的, 还是算了, 直接说思路吧. 从 Vue2.3 版本后, SSR 的 cookies, 就变成一个无比麻烦的问题, 具体请访问官网文档: https://ssr.vuejs.org/zh/api.html#runinnewcont
面向Vue新人：使用Vue自定义指令来完善一个Select组件本篇文章教大家写一个非常简单的Select组件，想必很多人都写过Select，毕竟它太常用了，但是本篇文章的示例使用到了Vue的自定义指令，如果你对Vue自定义指令不怎么熟悉的话，本篇文章或许会让您有所收获！完成的效果图如下：一、首先，我们简单布局一下
Event Loop是个什么玩意：从 Vue 的 nextTick 说起熟悉 Vue 的同学们都知道，Vue 有个 nextTick 方法，用来异步更新数据。来看看这个栗子： <body> <div id="main"> <ul class="list">
前端转换神器react-to-vue 近年来，前端技术不断火热，尤其以React和Vue技术最为火爆，这两个前端框架也是目前国内使用得最多的两个框架。虽然，在使用的广度上React虐胜一筹，但Vue框架的发展趋势也不容小觑，特别是去年React的MIT风波，越来越大的企业开始将目光转向了Vue。那
Web 前端性能基础指标 & 计算方式前端性能衡量指标从用户角度而言，打开一个页面想要的就是页面可以尽快有响应，加载完并且可以允许交互；因此前端的性能可以用白屏时间，首屏时间，可交互时间来衡量。下图是用户请求过程的截图，白屏时间就是用户发起请求之后到页面开始显示的时间，可以看到在324ms之前页面都是空白的，所以白屏时间就是3…
Vue是如何实现双向绑定的？本文主要探讨双向绑定，不对响应式做讨论哈前言一直对双向绑定的概念不是很清楚，处于“人云亦云”的状态，想要讲解却无法达到很好讲述水准，不能很清楚的讲明白这个概念。所以就有了写此文的想法。个人觉得，如果讲述者无法清晰、有条理、直白
JS 底蕴之变量、作用域和垃圾回收基本类型和引用类型在 JavaScript 中，数据类型可分为基本类型和引用类型，基本类型有六种：Null，Undefined，String，Boolean，Number，Symbol；而引用类型就是传说中的 Object 了。其中基本类型是按值传递
Async-Await≈Generators+Promises Async-Await ≈ Generators + Promises 这篇文章我将介绍ES2017的async函数为什么是ES2016的Generators和Promises特性功能的语法糖。阅读须知本文不对三者概念进行介绍和讲解本文唯一的目的就是
jquery html() callback 通过JQuery的.html()函数我们可以非常方便地加载一段HTML到指定的元素中，例如给<div></div>中放入一组图片。问题是JQuery的.html()函数是同步的，如果我们想知道HTML被加载之后容器的高，例如获取容器的offsetHeight或scrollHeight属性的值，必须要等HTML元素中所有的内容都加载完毕后才能获取到真实的值，…
Vue中computed的本质—lazy Watch 两个月前我曾在掘金翻译了一篇关于Vue中简单介绍computed是如何工作的文章，翻译的很一般所以我就不贴地址了。有位我非常敬佩的前辈对文章做了评价，内容就是本文的标题“感觉原文并没有讲清楚 computed 实现的本质- lazy watcher”。上周末正
关于JavaScript中this的软绑定所谓软绑定，是和硬绑定相对应的一个词，在详细解释软绑定之前，我们先来看看硬绑定。在JavaScript中，this的绑定是动态的，在函数被调用的时候绑定，它指向什么完全取决于函数在哪里调用，情况比较复杂，光是绑定规则就有默认绑定、隐式绑定、显式绑定、new绑定等，而硬绑定是显示绑定中的一种，通常情况下是通过调用函…
《css3D 的魅力》最近玩了玩用css来构建3D效果，写了几个demo，所以在博客中总结一下。（by 子慕大诗人）
vue项目中富文本编辑器踩坑之旅一开始选用了 tinymce ，遇到的问题如下：主要参照的是 https://github.com/PanJiaChen/vue-element-admin 第一个问题是引入静态文件的路径与此不一样第二个问题是当把这个放在 ivew 的 Modal 弹窗中，不能编辑，工具栏可以点击，但是编辑区域点了没反应后来自己…
《ES7 只有两个新功能，这是它们的工作原理》ES7 带来了两个新功能：Array.prototype.includes() 和新的指数运算符：** 。（唐耶尔译，欢迎加入翻译组：）
关于JavaScript的内存机制一、背景 var a = 20; var b = ‘abc’; var c = true; var d = { m: 20 } 因为JavaScript具有自动垃圾回收机制，所以对于前端开发来说，内存空间并不是一个经常被提及的概念，很容易被大家忽视。特别是很多不是计算机专业的朋友在进入到前端之后，会对内存空间的认知比较模糊，甚至有些人干脆就是一无所知. 当…
【20180525 前端开发日报】高效开发 Web 单页应用解决方案；Safe.js 3.0.0 发布，史上最大更新增加6项功能；快速介绍几个JS函数；v-charts | 饿了么团队开源的基于 Vue 和 ECharts 的图表工具；JS事件循环，了解一下?；Node-Web-Console——基于 N…详情→
如何让一个vue项目支持多语言（vue-i18n）这两天手头的一个任务是给一个五六年的老项目添加多语言。这个项目庞大且复杂，早期是用jQuery实现的，两年前引入Vue并逐渐用组件替换了之前的Mustache风格模板。要添加多语言，不可避免存在很多文本替换的工作，…
Web Bundler CheatSheet, 选择合适的构建打包工具题注：Web Bundler CheatSheet 属于 Awesome-CheatSheet 系列，盘点数个常用的开发打包工具清单。欢迎加入阿里南京前端团队，欢迎关注阿里南京技术专刊了解更多讯息。 Web Bundler CheatSheet | Web 构
人人都能懂的Vue源码系列(三)—resolveConstructorOptions函数上篇文章介绍了Vue构造函数的部分实现，如果当前Vue实例不是组件，则执行mergeOptions方法。 vm.$options = mergeOptions( resolveConstructorOptions(vm.constructor),
来学着写自己的“jQuery” jQuery是一套跨浏览器的JavaScript库，简化HTML与JavaScript之间的操作 jQuery是开源软件，使用MIT许可证授权。jQuery的语法设计使得许多操作变得容易，如操作文档对象（document）、选择文档对象模型（DOM）元素、创
Golang 在自定义的 https 服务器中启用 pprof 接口以下所有观点都是个人愚见，有不同建议或补充的的欢迎emial, aboutme 原文章地址 pprof的简介 pprof是golang标准库里面的其中一个库，它通过其HTTP服务器得到运行时的分析数据，从而给pprof可视化工具提供数据分析来源。它可以用来分析性能消耗，分析内存泄漏，死锁等。具体使用可以了解官方包pprof，那…
Safe.js 3.1.0 发布，8点准时到达增加双向绑定一天又一天，Safe.js更新准时到达！那么我们来看一下这次safejs的更新又更新了哪些内容：修改组件方法，可以重复渲染增加bindVal属性增加bindHTML属性增加bindText 具体想了解更新内容的可以进入我们在码云上的wiki！点赞是参与开源社区的必备礼仪（红薯说的…），前往 …