Elm架构

Elm是一个能够编译成Javascript的函数语言，它可以像React那样作为一个工具用来创建网站或网站应用，Elm 非常简单 易用和优质。

Elm作为函数语言有以下特点：
1.没有运行时的错误，没有null. 没有undefined is not a function.
2.错误信息友好，能够帮助你更快速加入功能。
3.良好架构的代码意味着你的应用代码以良好的构架增长。
4.对所有Elm包自动执行语义版本。.

下面以一个计数器为案例：

import Html exposing (Html, button, div, text)
import Html.App as Html
import Html.Events exposing (onClick)

main =
  Html.beginnerProgram { model = 0, view = view, update = update }

type Msg = Increment | Decrement

update msg model =
  case msg of
    Increment ->
      model + 1

    Decrement ->
      model - 1

view model =
  div []
    [ button [ onClick Decrement ] [ text "-" ]
    , div [] [ text (toString model) ]
    , button [ onClick Increment ] [ text "+" ]
    ]

Elm是一个针对无限嵌套组件的简单模式，它非常模块化，易于代码重用和测试，能够帮助你方便创建复杂的Web应用。

每个Elm程序逻辑被划分为三个清晰部分：
Model — 你的应用状态
Update — 更新状态的方式
View — 将状态作为HTML显示的方式

Elm架构是一种简单架构Web应用的模式，类似Redux一样声明，这也是它越来越流行的原因。

这个模式非常可靠，可以下面伪代码说明，每次使用只要填空细节就可以：

import Html exposing (..)


-- MODEL

type alias Model = { ... }


-- UPDATE

type Msg = Reset | ...

update : Msg -> Model -> Model
update msg model =
  case msg of
    Reset -> ...
    ...


-- VIEW

view : Model -> Html Msg
view model =
  ...

更详细说明见:http://guide.elm-lang.org/architecture/index.html

Elm 0.17发布以后，引入了消息订阅通过Websocket获得后台状态，只需要两行代码就可以实现和后端服务器交互：
WebSocket.send "ws://echo.websocket.org" input
WebSocket.listen "ws://echo.websocket.org" NewMessage

第一句是向服务器发出数据，第二句是监听服务器的数据，数据内容在NewMessage，NewMessage内容会自动喂给update。

而如果使用Javascript实现这段通讯，将会是非常麻烦，你需要创建一个新的web socket!然后打开一个连接，但是还不能忘记加入对错误的监听，以便连接失败能够重新再连接，并且定义在没有连接时不要发消息（这属于运行错误），你还需要对消息队列化然后再发送，然后确定websocket能被使用并且关闭等等，这些都是涉及大量细节，而声明式编程就应该如上面两行代码直接声明使用，去除了大量技术细节。

告别FRP
聊天演示