jayter 发布的文章

JavaScript框架的选择总是取决于项目特定的要求。
基本上考虑到框架的性能,可重用性,使用人数及社区的支持。

下面来介绍3款最流行的前端框架:

Vue.js
Angular
React

Vue.js

尽管Vue是一个年轻的框架,但它每个月都会越来越受到开发者社区的关注。它在首次推出后几年变得更加稳定,并成功地为许多初创公司和企业公司带来了价值。是的,React和Angular仍然在整体受欢迎程度上赢得了Vue,并试图将后者置于阴影中,但Vue逐渐被软件开发者所采用。根据JS 2018的状态,大约50%的受访者希望学习这个框架并且没有理由。

Vue主要因其温和的学习曲线和降低的复杂性而受到赞赏,因为构建简单的Web应用程序只需要很少的时间。它使组件具有反应性,这意味着应用于状态对象的任何更改在呈现的HTML中都是可见的。

React和Angular开发人员的好消息:切换到Vue很容易,因为它共享两个框架的概念。

其他Vue的优势在于:

一种面向组件的结构,它封装了可重用的代码,提供了灵活性并确保轻松扩展。
有助于使状态对象与视图和DOM完全同步的反应机制。
移动UI开发解决方案。
框架的小尺寸。它的出货量仅为18-21 KB。
有助于简化项目结构。
轻松集成到JavaScript应用程序中。
最后但并非最不重要的是全面的文档,涵盖了Vue及其生态系统的几乎所有功能。一个积极和不断发展的社区,有助于框架的发展是其不可否认的力量。

总而言之,如果您正在寻找一个易于入手的轻量级和渐进式框架,Vue是一个很好的选择。

Angular

Angular是一个用于构建用户界面的开源平台。它对于大型企业级项目至关重要,并且在前端框架中占据首要位置。

最初,它由Google工程师于2009年开发,被称为AngularJS。

后来,在2016年,该框架被重写并开始适应现代Web开发的要求。开发团队不断发布新版本。当前版本是Angular 7.0。Angular是MEAN堆栈的一部分,涵盖四个主要的软件开发支柱:MongoDB,Express,Angular和Node.js

但是应该考虑到Angular更适合构建复杂的长期应用而不是SPA,因为它需要陡峭的学习曲线。

Angular的核心是TypeScript – 一种使代码更易于维护的语言,因为它提供了类型系统和可靠的类型检查。由于TypeScript是独立于浏览器更新的,因此您无需依赖浏览器即可使用该语言的所有新功能。

除了框架本身,开发人员还使用RxJS等工具来处理异步数据,使用Angular CLI轻松创建项目,调试和部署。

你会喜欢Angular的特点是:

基于组件的体系结构,提醒MVC但使组件可重用,封装代码并提高其生产效率。
双向数据绑定,使模型与视图同步,无需编写过多的代码。
分层依赖注入使组件可重用且易于维护。
采用移动优先方法设计。
性能快速。但是,它在很大程度上取决于代码的质量。
易于编写和读取的模板语法。
确保轻松进行单元测试的组件。
积极和大型社区。
适合迭代开发。
总而言之,如果您正在构建复杂的系统但是不太方便创建快速变化的用户界面,Angular是您项目的一个非常棒的前端技术。对于后一种情况,最好使用更轻巧且更容易学习的React和Vue。

React

无论您是初学者还是经验丰富的前端开发人员,您都会听说过React。

由Facebook开发人员创建,最初的目的是提高他们的代码效率,目前React是一个领先的前端框架和发展最快的技术。这并不奇怪,因为它极大地简化了为Web应用程序构建丰富的交互式UI的过程。

JavaScript 2018的结果表明,在2016 – 2018年期间,React的受欢迎程度逐渐增长:

它的优点在于它得到了来自世界各地的大型开发人员的支持。

此外,该框架对于新手来说完全是用户友好的 – 指南有助于应对学习过程中出现的任何困难。因此,您可以在几个小时内学习React的基础知识,并进一步掌握其高级方面的详细文档。

除了React之外,开发人员还倾向于使用ES6,Redux状态管理库,Express,Jest和React Native来实现无缝移动体验。

开发人员喜欢React的这些功能:

基于组件的架构。
优雅的编程风格和声明性视图,有助于生成清晰且可维护的代码。
由于单向数据绑定而导致的快速性能使得使用虚拟DOM更快地进行操作。
有效的事件处理。
JSX – 一种标记语法,可以使组件不复杂。
采用和普及功能范例,简化了开发,使应用程序状态的管理更加可预测。
SEO友好。
最重要的是,如果您必须处理应用程序中的实时数据,这是一个不错的选择。

1.请求异步化
将系统的请求异步处理。

2.优化nginx-php-fpm
高并发情况下,系统会出现超时和等待处理的情况

2.1 php-fpm 参数优化

request_terminate_timeout=180
//解决Nginx报502 Bad Gateway错误
pm.max_children=1000
//增加PHP进程数,增加并发处理能力;
此参数可根据服务器内存情况配置,每个进程大概占用20多M内存。
pm.max_requests=10000
//增加PHP单进程处理的请求数,防止大量进程同时重启造成的不可用风险
listen.backlog=65535
//解决高并发下TCP连接过多,Nginx报500的错误。

2.2 nginx 调优

location ~ .php$ {
      fastcgi_connect_timeout 180 ;
      fastcgi_send_timeout 180 ;
      fastcgi_read_timeout 180 ;
 }
//解决Nginx报504 Gateway Time-out错误
  1. linux内核调优
//1.    修改TCP协议栈并发连接 backlog 设置
net.core.somaxconn=32768
net.core.netdev_max_backlog=32768
net.ipv4.tcp_max_syn_backlog=32768
//2.    修改TCP协议栈连接追踪设置
net.nf_conntrack_max=655360
net.netfilter.nf_conntrack_max=655360
net.netfilter.nf_conntrack_tcp_timeout_time_wait=30
//3.    设置可用端口范围
net.ipv4.ip_local_port_range='1000 65535'
//4.    放开服务器最大文件句柄65535的限制
fs.file-max=2097152
sysctl -w fs.nr_open=2097152
//修改系统全局允许分配的最大文件句柄数
ulimit -n 1048576
//设置当前会话/进程打开文件句柄数
soft    nofile      1048576
hard   nofile      1048576
//修改/etc/security/limits.conf配置中允许用户/进程打开文件句柄数