Salesforce Lightning Web Componentとkintone JavaScript カスタマイズの比較

kintoneは当初よりJavaScriptでのカスタマイズを機能の一部として提供しています。
Salesforceも2019年にLightning Web ComponentsというWeb ComponentsベースでJavaScriptによるカスタマイズができるという機能も提供しています。
kintoneのJavaScript開発の経験はもともとありますが、最近仕事でLightning Web Componentsにも触れる機会があったので、JavaScriptでカスタマイズしてみた感想を述べます。

SalesforceとLightning Web Components

公式で概要についてはここにまとめられています。
Lightning Web コンポーネントの概要

かいつまんで説明すると、下記のような特徴があります。

• Web標準に準拠している（Web Componentsベース）
• JavaScript/HTML/CSS各種用意するだけでカスタマイズが可能
• Salesforce DXという統合開発ツールセットがあり、開発環境の用意やDeployなど開発をサポートしてくれる
• サンプルがGithubなどで公開されているし、Web標準準拠なのでエコシステムにのることができる（ただし一部。詳細は後述）
• Visutal Stadio Code用の拡張機能を提供している

Salesforce DX（developer experience）と銘打った環境を用意しているように、Salesforce自体が、開発者に開発してもらいやすくするということを、かなり意識しているのがわかります。今まではApexやAuraコンポーネントなどの独自言語やSalesforceでしか使えない仕組み・機能しかなく、身につけるための情報が少なかったり、一通り覚えたとしても流用がきかないので、一般的な開発者が飛び込みにくい側面があったと思っています。
しかしそれではSalesforce周りのエコシステムが育ちませんし開発者に受け入れられにくいので、Web標準を掲げ、DXも良くすることで、デベロッパーフレンドリーな印象を与え、開発の敷居を下げる努力をしていると思います。

kintoneとkintone JavaScript カスタマイズ

公式でチュートリアルとしてここにまとめられています。
JavaScriptを使用したkintoneのカスタマイズ

kintoneのJavaScriptカスタマイズは下記のような特徴があります。

• JavaScriptとCSSによるカスタマイズが可能。
• JavaScriptからデータにアクセスするために、kintone JavaScript API / REST API が用意されている。
• レコード作成画面、編集画面、詳細画面表示時など、いくつかイベントハンドラが提供されており、それをフックしてJavaScriptを動作させることができる。
• 2020年現在、エコシステムも育ってきており、JavaScriptカスタマイズのためのCLIでDeployするなどのサポートツールなどもある。
• ファイルサイズなどの制限は多少あるものの、JavaScriptの開発知識がそのまま使える。

kintoneはSalesforceと比べると歴史も浅いですが、その分当初よりJavaScriptによるカスタマイズも前提としており、特にフロントエンドなどの開発者が参画しやすい状況でした。

Salesforce Lightning Web Componentsとkintone JavaScriptカスタマイズの違い

冒頭に述べたとおりSalesforceがDXに重きを置き始めているのを知って、kintoneをもともと触ったことがあるかつ、フロントエンド開発もしている僕としては、kintoneのようにJavaScriptによるカスタマイズができるようになるのであれば、Salesforce上でもいろんなことができるし、フロントエンドのエコシステム（たとえばwebpackや各種npmなどで公開されているライブラリの使用）に乗っかることができるであろう、と考えていたのですが実際には下記のような違いがありました。

kintoneはJavaScriptファイルであればなんでもアプリに組み込めるが、Salesforceには制限がある。

Lightning Web Componentsを触り始めて、正直、これはかなり期待と違った部分になります。
そもそも、kintoneではJavaScriptファイルであればどう動こうともそれに介入しようとしません。制限されている関数も（おそらく）ないですし、kintoneを操作するためのAPIがwindow.kintoneに生えるくらいで、JavaScriptができる範囲ならなんでもできるというようなスタンスです。
Salesforceはそうではなく、JavaScriptの組み込み関数は一部排除されていたりHTMLに独自の記法などを強いられますしWeb準拠と銘打つものの完全にそうではないかと思います。

上記のとおりですので、まず、kintoneではES5だろうがECMA Script 2019だろうが、というかSyntax Errorがおきようが、なんでもJavaScriptを組み込めます。実際には組み込むというより、ただJavaScriptファイルをアップロードするだけですので、これは当然です。
しかし、Salesforceではそうはいかず、バージョンによる制限がありますし、Syntax Errorがある場合環境にアップロードするときにエラーで弾かれますし、そもそもファイルのバンドル自体許していません。生のJavaScriptをSalesforceにアップロードし、そこでバンドルが行われるようです。そのため、そこでビルドエラーがあればDeployを許可しませんし、import/exportは使えるものの、package.jsonなどもサポートしていませんしnode_modules自体もアップロードできるわけではありませんから、この時点で自由度に関してはかなり制限されていると見ていいと思います。

ですので、残念ながら例えばTypeScriptは（そのままでは）もちろん利用できませんし、Reactなどのフレームワークも使えないと見たほうがいいです。（これも使えないことはないが）
よくあるのフロントエンド開発のようにReact、Vue、Angularなどを使っていくのではなく、基本的にはWeb Componentsに乗っかった書き方になると思います。

ただ、Salesforceは最初からディレクトリ構成などもルールがあることによって、レールが敷かれているという見方もできます。Visual Studio Codeとの連携も悪くないですし、Apexで関数を用意するとjsconfig.jsonが書き換わり（個人的には勝手に書き換わるのは気持ち悪いですが)JavaScript側からもアクセスしやすかったりと、オールインワンに開発できる側面はあります。

kintoneはフロントエンド開発に強いメンバーがいなければ、自由な分、それはそれでとっつきにくい側面もあるかもしれません。

kintoneはデータや画面にアクセスするためのAPIを各種用意しているが、Salesforceの場合なんでも柔軟にできるわけではない。

これも大きな違いです。kintoneはあくまでJavaScriptによるカスタマイズにあまり介入しませんので、データを取ってきたい場合は自身が画面表示イベント発火などをきっかけにREST APIなどをコールする必要があり、逆にいえばデータに対して素直にアクセスできる状態です。
一方SalesforceはLightning Web Componentsで提供されるライフサイクルを意識しなければならず、データを取得する場合はApexとの連携が必要になります。ただ、ApexではSQLににた構文でデータがとれますし、Joinなどもそこで行なえます。kintoneはJavaScript側で必要に応じていろんなアプリからデータを取得し整形する必要があります。

まとめ

• Salesforceは結局オールインワンであることは変わらない。その分カスタマイズの規約が厳しい。
  • JavaScriptによるカスタマイズに関しては、Lightning Web ComponentsがでたおかげでJavaScriptの知識が生きる、がフロントエンド開発のエコシステムにはあまり乗れないと思ったほうがいい。
  • SalesforceひとつでいろんなことができるメリットはもちろんあるのでSalesforceを使うならばそれとトレードオフを飲むしかない。
• kintoneはUI付きのWebデータベースでオールインワンではない。その分カスタマイズの制限がゆるい。
  • JavaScriptによる開発が自由にできる。フロントエンド開発者もそのまま知識をほとんど活かせる。ReactやVueなどのライブラリももちろん使える。
  • kintone自体はそこまでなんでもしてくれるわけではない分、開発者がやること自体は多くなりがち

Salesforceに関しては歴史が長いですし、オールインワンでできることが多く後方互換も大事にしています。また、大規模エンタープライズも想定していますしセキュリティリスクに関してもかなり考慮しているはずですので、いくらJavaScriptによるカスタマイズができるようになったといっても、制限が生まれてしまうのは仕方がないかと思います。JavaScriptのエコシステムにそのまま乗っかれないのは残念ではありますが、今までと比較してモダンなカスタマイズ方法の選択肢が増えたというのは喜ばしいことだと思います。

逆に、JavaScriptのエコシステムに乗りたい・ゴリゴリにフロントエンド開発したいならkintoneがオススメですが、逆に自分でなんとかしないといけない領域は多くなりがちなので、オールインワンなSalesforceとメリット・デメリットはありますね。