TeamGenik由Elixir和Phoenix LiveView制成

编程语言Elixir

TeamGenik的核心系统是用功能编程语言Elixir编写的。

Elixir是一种诞生于2012年的新语言。与1972年诞生的C，1991年诞生的Python，1995年诞生的Java，Ruby等相比，它还不为人所知，但它在Web和IoT领域中越来越受欢迎。 InfoQ的Programming Languages InfoQ Trends Report于2019年10月发布，指出Elixir已进入“创新者”阶段。

Phoenix Framework

TeamGenik使用Phoenix Framework（“Phoenix”），这是一个基于Elixir的Web应用程序开发框架。

Phoenix受Ruby on Rails的影响很大。特别地，路由和控制器机制非常相似。 Phoenix用于数据库操作的库Ecto与Active Record相似。对于熟悉Ruby on Rails的我们来说，Phoenix是一个非常自然的选择。

Phoenix LiveView

TeamGenik使用Phoenix LiveView呈现HTML代码。 Phoenix LiveView分两步生成HTML代码：

• 响应于应用程序外部发生的事件，应用程序的“状态”将转换为新的“状态”。  
• 检测“状态”的变化并生成HTML代码。

Phoenix LiveView通过WebSocket在浏览器和服务器之间提供恒定的连接。

Phoenix LiveView仅将由于“状态”的更改而在HTML代码中生成的“差异”发送到浏览器，因此可以将浏览器与服务器之间的通信量保持在较低水平。

单页应用程序（SPA）开发的新趋势

TeamGenik构建为单页应用程序（SPA）。换句话说，不是每次用户单击链接时都导致屏幕切换，而是当场更改了屏幕的一部分。

在2010年代后期，SPA开发蓬勃发展，并且诸如React，Angular和Vue之类的JavaScript框架得到了广泛使用。

但是，我们看到了自2020年代以来的趋势，因此选择了Phoenix LiveView。Phoenix LiveView的SPA开发与上一个有很大不同，因为它以服务器端为中心。

上图比较了使用JavaScript框架的系统配置和使用Phoenix LiveView的系统配置。写为“State”的两个椭圆表示应用程序保存的数据（状态）。在任何系统配置中，都会从此“State”生成HTML代码。当由于用户操作而导致“State”更改时，HTML代码也会相应更改，浏览器屏幕也会更改。

在左侧的系统配置中，“State”位于浏览器上。为了重写此“State”并从“State”生成HTML代码，大型JavaScript程序将在浏览器上运行。另一方面，在右侧使用Phoenix LiveView的系统配置中，“State”在服务器端。 Elixir程序正在服务器上运行，重写“State”并从“State”生成HTML代码。它与一个小型JavaScript程序连接，该程序在使用WebSocket的浏览器上运行，从浏览器接收事件，并将HTML代码差异发送到浏览器。

开发重点已从前端（浏览器端）转移到服务器端的主要原因有四个：

• 几乎不需要使用JavaScript（一种非功能语言）进行编程。换句话说，几乎整个系统都可以用一种语言（Elixir）来开发。
• 无需实现从前端接收查询的API。
• 无需在前端和服务器端创建相同类型的功能（验证等）。
• 恶意用户无法分析JavaScript源代码来获取系统攻击提示或揭示商业秘密。

当然，有些东西会丢失。将用户计算机上完成的某些处理移至服务器端意味着增加了服务器负担。它还增加了前端与服务器端之间发生的通信量。另外，如果浏览器和服务器被网络分隔开，则用户可能会感觉更加敏感。

我们相信，随着Phoenix LiveView的开发和接受，这些缺点将得到克服。毕竟，0.1版刚刚于2019年8月发布，但尚未达到1.0版。

LiveView Socket与浏览器具有一对一的对应关系

在传统的Web系统中，少数Web应用程序响应来自大量浏览器的访问（请参阅下文）。

一个Web应用程序按顺序处理来自多个浏览器的请求。同样，哪个Web应用程序负责来自某个浏览器的请求也不是恒定的。结果，Web应用程序无法保存特定于浏览器的数据。数据存储在数据库中或浏览器的“State”中。

另一方面，在使用LiveView的系统中，LiveView Socket与浏览器具有一一对应的关系，如下图所示。两者始终通过WebSocket连接。

每个LiveView Socket很小，可以在单个服务器上继续运行成千上万个。每个LiveView Socket有一个唯一的“State”。

这样，使用Phoenix LiveView从根本上改变了创建Web系统的方式。