20170621 前端开发日报

如何优雅地在 React 中处理事件响应;使用浏览器开发者工具检查 CSS 动画性能;JavaScript 函数式编程到底是个啥;[Vue全家桶]每个人都能做的网易云音乐;js数组操作–使用迭代方法替代for循环;web 前端图片懒加载实现原理;可能是东半球最详解的web前端安全相关知识;TypeScript 简介

  1. 如何优雅地在 React 中处理事件响应 React中定义一个组件,可以通过React.createClass或者ES6的class。本文讨论的React组件是基于class定义的组件。采用class的方式,代码结构更加清晰,可读性强,而且React官方也推荐使用这种方式定义组件。 处理事件响应是Web应用中非常重要的一部分。React中,处理事件响应的方式有多种。 1.使用箭头函数 先上代码: 当...
  2. 使用浏览器开发者工具检查 CSS 动画性能 本文是我们和SiteGround一起合作的系列之一。感谢我们的合作伙伴,有了你们,SitePoint才成为可能。 CSS动画的性能可以非常好。虽然对简单动画和少部分元素来说这是事实,但是如果你不注意编写高性能的动画代码,额外增加了很多复杂性,网站用户很快就会注意到(动画性能很差),并产生厌恶。 本文里,我会...
  3. JavaScript 函数式编程到底是个啥随着大前端时代的到来,在产品开发过程中,前端所占业务比重越来越大、交互越来越重。传统的老夫拿起JQuery就是一把梭应付当下重交互页面已经十分乏力。于是乎有了Angular,React,Vue这些现代框架。 但随之而来...
  4. [vue全家桶]每个人都能做的网易云音乐仿网易云音乐(webapp) 项目地址 (project address) api来源 感谢binaryify让我能用喜欢的东西做一个属于自己的播放器! 源码地址 不要脸的求star 哈哈哈!!! 项目预览 1mhere.cn (pc端按F12切换手机调试模式效果更...
  5. js数组操作--使用迭代方法替代for循环前言 数组的迭代方法,这个想必大家都不陌生了,可能刚入门的人暂时还没接触到这个。但是以后的开发中,肯定会用得上的。我自身的一个使用经历就是,如果迭代方法用的适当,不但可以减少代码量,也能使代码可读性...
  6. web 前端图片懒加载实现原理 web 前端图片懒加载实现原理 —— 由zoom1480063633000分享
  7. 可能是东半球最详解的web前端安全相关知识XSS XSS全称是跨站脚本攻击(Cross Site Scripting),所以我们可以缩写成CSS,下面我们开始介绍CSS,先讲选择器。听着是不是很奇怪,为了与层叠样式表区分开来,我们选择XSS做为其缩写。 XSS攻击能获取页面数据、c...
  8. TypeScript 简介建了个群有兴趣的朋友可以加一下 QQ 群:Angular 修仙之路 - 153742079 (群名称规则:城市 + 昵称)。 TypeScript 是什么 TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集,而且...
  9. C++ 调用 Web Services首先,gSoap 肯定是个不错的选择,但是如果你的程序要调用多个 Web Services(即有多个 WSDL),gSoap 会比较麻烦。还有一个问题就是,gSoap 从 WSDL 自动生成的代码实在是太难用了。当然,这些都不是什么问题,...
  10. 再造一个有赞微商城也不在话下,有赞 React 组件库(Zent)的开源与展望Zent ( ˈzent ) 是有赞 PC 端 WebUI 规范的 React 实现版本,提供了一整套基础的 UI 组件。目前我们有 35+ 组件,这些组件都已经在有赞的各类 PC 业务中使用。我们会在此基础上,持续开发一些新组件。 我们的目标...
  11. Golang 的 JSON 使用小技巧 有的时候上游传过来的字段是string类型的,但是我们却想用变成数字来使用。 本来用一个JSON:",string"就可以支持了,如果不知道golang的这些小技巧,就要大费周章了。 参考文章:http://attilaolah.eu/2014/09/10/json-and-struct-composition-in-go/ 临时忽略struct字段 type User struct { Email...
  12. Node.js 垃圾回收与内存泄露的排查 原文地址:https://blog.codeship.com/understanding-garbage-collection-in-node-js/ 阅读时间: 8 分钟 尽管总有一些Node.js(通常)性能方面的负面报道,这并不是说Node.js比其他技术更容易出现问题。我们需要清楚知道Node.js是怎么玩的。 虽然这项技术的学习曲线相当平坦,但是其内部的...
  13. vue mixins组件复用的几种方式最近在做项目的时候,研究了mixins,此功能有妙处。用的时候有这样一个场景,页面的风格不同,但是执行的方法,和需要的数据非常的相似。我们是否要写两种组件呢?还是保留一个并且然后另个一并兼容另一个呢? 不...
  14. 在gitlab 中使用webhook 实现php 自动部署git 代码在技术团队讨论中,我们决定从svn 迁移到 git ,于是使用了gitlab,代码自动部署使用了webhook 在服务器上 1.开启PHP需要的环境支持 服务器环境必须先安装git 环境,webhook 依赖php运行环境,同时需要使用shell_e...
  15. 前端知识 - 收藏集 - 掘金一道 JS 面试题所引发的 "血案",透过现象寻本质,再从本质看现象 - 前端 - 掘金觉得本人写的不算很烂的话,可以登录关注一下我的GitHub博客,新手写东西写的不好之处,还望见谅,毕竟水平有限,写东西只为交流提...
  16. React Native Android白屏优化终极方案本方案适用于Android原生项目集成React Native框架。 问题描述 我们公司的APP部分模块使用了react native进行开发,使用react native开发确实很爽,一次编写到处运行,前端的开发体验,高效的开发效率,但是我们...
  17. 你真的了解HTTP缓存吗 】这里总结的实用并速记的规则,希望对大家有所帮助。全文=> ​​​   有时,HTTP中的缓存可能会非常让人头疼。按照文档正确地使用 HTTP 并不是那么困难,但事实上,不同的浏览器和 HTTP版本常常困扰着我们。而我们自己或是不必或是没有时间去钻研所有的边缘的情况。   这里总结的实用并速记的规则,希望对大家有所帮助   静态资源   永远不会修改的内容:JS 和 ...
    你真的了解HTTP缓存吗
  18. JavaScript 异常的防范与监控一套完善的前端体系应少不了异常统计与监控,即使有足够的质量保证体系,难免会出现一些意料之外的事,尤其是在复杂的网路环境和运行环境之下。为了保证代码的健壮性以及页面的稳定性,我们从多个方面来做异常的...
  19. Node.js Color 模块实现入门浅析 Node.js 中有不少常用的 Color 模块,例如 chalk、colors.js、cli-color 等,通过这些模块我们输出各种带颜色、方面区分或者更酷的日志以及 CLI 工具提示。那么今天带大家简单了解一下 Color 模块的实现。本文会与你一一叙述 —— 由XaYvier分享
  20. 【英】现代 Web 开发魔法书 一本关于现代 Web 开发涉及的知识分类与概览,旨在帮助开发者们获取最新、常用的 API、库、工具、最佳实践以及学习资源。目前已经涵盖了 2000+ 的相关资源链接,供大家参考与学习。 —— 由IT程序狮分享
  21. JavaScript专题之数组去重前言 数组去重方法老生常谈,既然是常谈,我也来谈谈。 双层循环 也许我们首先想到的是使用 indexOf 来循环判断一遍,但在这个方法之前,让我们先看看最原始的方法: {代码...} 在这个方法中,我们使用循环嵌套,...
  22. React Native 路由理解和 react-navigation 库封装学习 react native 等移动端 app 路由控制常见理解和 react-navigation 库的集中封装展示 —— 由Custom_DOM分享
  23. CSS 使图片高度等于自身宽度的倍数 现在有一个组件,我们想随意给它个宽度,都能 使它的高度与宽度成比例 。 你可以在组件外部添加容器,但请不要给组件添加 class 和 id 。 请写出该场景的解决方案,要求其样式可复用。代码见下方。 —— 由freeedit分享
  24. CSS 实现左边定宽右边自适应效果 现在有一个容器,其中放有两个 div,HTML 和 CSS 代码如下所示。 我们需要这两个 div 并排在一行,并使左边的 div 宽度确定, 右边的 div 宽度能够自适应剩余的容器宽度 。 请写出你能想到的所有可能。 —— 由freeedit分享
  25. webpack 之 loader 实践 webpack 支持通过 loader 的方式转换应用程序的资源文件,通过 raw-loader 和 ejs-loader 加载 underscore 的模板文件的不同来理解 webpack 的 loader 概念 —— 由大河89分享
  26. Dropdown.js 前言 在SPA(Single Page Application)盛行的时代,jQuery插件的轮子正在减少,由于我厂有需求而开发了这个插件。如果觉得本文对您有帮助,请给个赞,以表对我的鼓励和支持。(๑•ᴗ•๑)如果觉得有什么问题,可以到 Github 提Iss
  27. 基于 webpack2 实现的多入口项目脚手架 主要使用 extract-text-webpack-plugin 实现 js 、css 公共代码提取,html-webpack-plugin 实现 html 多入口,less-loader 实现 less 编译,postcss-loader 配置 autoprefixer 实现自动添加浏览器兼容前缀,html-withimg-loader 实现 html 内引入图片版本号添加和模板功能,babel-loader 实现 ES6 转码功能, happypack ...
  28. Vue SSR 官方文档实践 · 一:从零到粗暴混合前后端 Vue 2.3 发布很久了,距离第一次打开 ssr.vuejs 也很久了。 终于把其中的代码片段运行起来了。 按照个人理解,成功使用了下服务端渲染的结果。 过程虽然很粗糙,也是使出了浑身解数。 —— 由songlairui分享
  29. JS 中的递归 递归, 递归基础, 斐波那契数列, 使用递归方式深拷贝, 自定义事件添加 —— 由她们都叫我剑侠分享

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

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

原创文章:20170621 前端开发日报 ,未经许可,禁止转载,©版权所有
原文出处:前端开发博客 (http://caibaojian.com/fe-daily-20170621.html)

发表评论

请登录后发表评论: