阿里云前端周刊 - 第 18 期

简介: ## 推荐 ### 1. 深入浅出 React 高阶组件 https://zhuanlan.zhihu.com/p/28138664 由高阶函数引申高阶组件,高阶组件是接受 React 组件作为输入,输出一个新的 React 组件的组件,本文介绍了在 React 工程中如何编写和使用高阶组件,以及结合 Decorator 的一些实践。 ### 2. 高性能 MobX 模式(

推荐

1. 深入浅出 React 高阶组件

https://zhuanlan.zhihu.com/p/28138664

由高阶函数引申高阶组件,高阶组件是接受 React 组件作为输入,输出一个新的 React 组件的组件,本文介绍了在 React 工程中如何编写和使用高阶组件,以及结合 Decorator 的一些实践。

2. 高性能 MobX 模式(part 2)- 响应变化

https://zhuanlan.zhihu.com/p/28082321

MobX 可以保证,无论何时你的响应式数据发生了变化,相应的依赖于 observable 的属性会自动同步更新。这意味着你现在可以专注于响应变化和处理变化带来的副作用,而不需要为数据的同步操心,让我们深入一下,看看有哪些方式可以让你处理副作用。

3. 原子设计方法论

https://zhuanlan.zhihu.com/p/27808988?utm_source=com.alibaba.android.rimet&utm_medium=social

原子设计是一种有用的设计和开发方法,但基本上它只是构建界面的一种心理模型。现在你可能会想知道如何使用原子设计。亲爱的读者不用害怕,因为本书的其余部分将会着重于工具和过程,使你的原子设计梦想成真。

4. 我用了两个月的时间才理解 let

https://zhuanlan.zhihu.com/p/28140450

在 let 刚出来的时候,就「以为」理解了 let。然鹅在过去的两个月里,对 let 的理解发生了一波三折的变化。作者写这篇文章,是希望其学习过程,能对其它人自学有帮助。

其它

1. ES6 中的 JavaScript 工厂函数实现

https://medium.com/javascript-scene/javascript-factory-functions-with-es6-4d224591a8b1

本文归属于 Eric Elliott 发布的 Composing Software 系列,介绍在 JavaScript ES6 语法背景下如何实现工厂函数。所谓工厂函数即是非类或者构造函数的,能干会某个新创建对象的函数;工厂函数能够简化我们创建新对象的过程,本文即是详细地介绍了如何实现工厂函数,也是一篇不错的 ES6 函数语法讲解;

2. 基于 React.js 的简单数据可视化

https://codeburst.io/simple-data-visualization-with-react-js-svg-line-chart-tutorial-df12e5843ce

本文旨在介绍如何利用 React.js ,并且不借助任何第三方库的帮助,来实现简单的 SVG 线型图。本文首先讨论如何利用 Create React App 搭建简单 React 项目,然后介绍了 SVG 的基础语法以及如何创建模拟数据,最后介绍了如何进行逻辑代码分割并且编写单独的 LineChart 组件;

3. Web 开发中的十大常用工具

https://medium.com/envato/our-top-10-free-tools-for-frontend-web-development-15d8a6052652

每年都会涌现出很多优秀的 Web 开发辅助工具,而本文是来自于 Envato 的工程师分享的他们开发中常用的十个工具。本文依次介绍了可用于生成网格的 Grid.Guide、类似于 BootStrap 的样式库 Foundation、在线代码编辑与共享工具 CodePen、jQuery 插件聚集地 Unheap、自动界面刷新工具 LivePage、整页抓取工具 FullPage Screen Capture、字体辅助 WhatFont、Node/Npm、移动端速度测试、响应式速度测试工具等。

4. React 开源许可证风波

https://wptavern.com/react-users-petition-facebook-to-re-license-react-js-after-apache-software-foundation-bans-bsdpatents-license-in-dependencies

近日,Apache 基金会宣布禁止使用包括 React 在内的, Facebook 带附加条款的 BSD Licence的开源软件,引发了部分使用者的担忧;社区已经有很多人请愿修改 React 开源许可证,同时 Facebook 另一开源项目 RocksDB 已经表示会在截止日期前修改许可证;React 项目维护者表示 Facebook 内部正在讨论此事,我们也会持续跟踪。

5. npm 5.3.0 发布

http://blog.npmjs.org/post/162986246605/v530-2017-07-13

自 5.x 版本发布之后,npm 一直致力于提升版本迭代速度,尽可能地通过小的更新来修复 npm 存在的问题。而本周发布的 5.3.0 版本为 npm ls 命令添加了 --link 参数,并且为 npx 添加了更多的支持语言版本;此外该版本还修复了一系列版本控制上的问题。

目录
相关文章
|
弹性计算 前端开发 小程序
微信小程序上传文件至阿里云OSS直传(java后端签名+前端直传)
当前的通用文件上传方式是通过前端上传到服务器,再由服务器转存至对象存储。这种方式在处理小文件时效率尚可,但大文件上传因受限于服务器带宽,速度较慢。例如,一个100MB的文件在5Mbps带宽的阿里云ECS上上传至服务器需160秒。为解决此问题,可以采用后端签名的方式,使微信小程序直接上传文件到阿里云OSS,绕过服务器中转。具体操作包括在JAVA后端引入相关依赖,生成签名,并在微信小程序前端使用这个签名进行文件上传,注意设置正确的请求头和formData参数。这样能提高大文件上传的速度。
3329 1
|
前端开发 安全 JavaScript
在阿里云快速启动Appsmith搭建前端页面
本文介绍了Appsmith的基本信息,并通过阿里云计算巢完成了Appsmith的快速部署,使用者不需要自己下载代码,不需要自己安装复杂的依赖,不需要了解底层技术,只需要在控制台图形界面点击几下鼠标就可以快速部署并启动Appsmith,非技术同学也能轻松搞定。
|
敏捷开发 缓存 前端开发
阿里云云效产品使用问题之流水线构建前端项目比较慢。该如何优化
云效作为一款全面覆盖研发全生命周期管理的云端效能平台,致力于帮助企业实现高效协同、敏捷研发和持续交付。本合集收集整理了用户在使用云效过程中遇到的常见问题,问题涉及项目创建与管理、需求规划与迭代、代码托管与版本控制、自动化测试、持续集成与发布等方面。
|
前端开发 对象存储 数据安全/隐私保护
阿里云前端直传has been blocked by CORS policy: Response to preflight request doesn‘t pass access control
阿里云前端直传has been blocked by CORS policy: Response to preflight request doesn‘t pass access control
1415 2
|
前端开发 JavaScript API
前端 JS 经典:阿里云文件上传思路
前端 JS 经典:阿里云文件上传思路
300 0
|
存储 监控 前端开发
【专栏】阿里云ARMS前端监控的引入方法,以提升应用质量和稳定性
【4月更文挑战第29天】本文介绍了阿里云ARMS前端监控的引入方法,以提升应用质量和稳定性。该工具通过实时收集和分析用户行为、性能数据,提供错误监测和实时告警。步骤包括注册阿里云账号,创建前端监控项目,获取并嵌入监控代码到页面中,部署并运行,最后查看监控数据。案例和经验分享强调了合理设置监控指标、与其他工具结合以及定期分析数据的重要性。注意保护用户隐私,正确管理监控代码,并解决可能出现的数据不准确和大量错误告警问题。
419 1
|
前端开发 JavaScript
阿里云验证码2.0 验证时报错 前端页面获取的验证参数有问题,动态JS加载失败,请问怎么解决啊?急,急,急。
用户反馈校验时遇到错误,日志显示验证码参数获取异常。采用无痕验证,失败后,返回`{captchaResult:false,bizResult:false}`,未触发滑块二次验证。
|
前端开发 应用服务中间件 Linux
使用阿里云服务器部署前端项目
使用阿里云服务器部署前端项目,完成后可通过服务器域名访问网页
2770 0
使用阿里云服务器部署前端项目
|
机器学习/深度学习 XML 人工智能
|
监控 JavaScript 前端开发
如何引入阿里云ARMS前端监控?
如何引入阿里云ARMS前端监控?

热门文章

最新文章

  • 1
    前端如何存储数据:Cookie、LocalStorage 与 SessionStorage 全面解析
  • 2
    前端工程化演进之路:从手工作坊到AI驱动的智能化开发
  • 3
    Vue 3 + TypeScript 现代前端开发最佳实践(2025版指南)
  • 4
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
  • 6
    实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
  • 1
    前端如何存储数据:Cookie、LocalStorage 与 SessionStorage 全面解析
    384
  • 2
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
    139
  • 3
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
    154
  • 4
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(七):学习ransform属性;本文学习 rotate旋转、scale缩放、skew扭曲、tanslate移动、matrix矩阵 多个参数
    117
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
    213
  • 6
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
    266
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
    132
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(三):元素继承关系、层叠样式规则、字体属性、文本属性;针对字体和文本作样式修改
    65
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(二):CSS伪类:UI伪类、结构化伪类;通过伪类获得子元素的第n个元素;创建一个伪元素展示在页面中;获得最后一个元素;处理聚焦元素的样式
    129
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
    174