Ele.me の Zhang Long: フロントエンド インフラストラクチャ構築への道

[51CTO.comより引用] 2017年12月1日～2日、51CTO主催のWOTDグローバルソフトウェア開発技術サミットが深セン中州マリオットホテルで開催されます。このサミットのテーマはソフトウェア開発であり、数十名の専門家ゲストが多くの素晴らしい技術コンテンツを共有します。当時、Ele.meのシニアテクニカルマネージャーである張龍氏は、フロントエンド開発実践セッションで「Ele.meのフロントエンドインフラストラクチャの構築」に関する基調講演をゲストと共有し、Ele.meチームがフロントエンドインフラストラクチャを構築するプロセスと、実践で得た経験や考えについて詳しく説明します。 51CTO は、皆様がこのカンファレンスにご参加いただき、テクノロジーがもたらす喜びを私たちと共有していただくことを心より願っております。

51CTO記者は、同会議で講演する張龍氏に独占インタビューを行った。彼がフロントエンドのインフラ構築をどのように解釈しているかを少し覗いてみましょう。

開発チームとユーザーの両方にサービスを提供

今日、ソフトウェア開発技術は日々変化しており、その中でフロントエンド インフラストラクチャの構築は非常に重要です。一方では、より優れたユーザー エクスペリエンスを実現し、ユーザーを維持するためです。一方では、開発をスピードアップし、開発効率を向上させ、企業にとってより大きな価値を生み出すことです。

企業内にフロントエンドエンジニアが 50 人以上いる場合、効率化を図るツールやサービスを提供するチームがなければ、ある程度のリソースの無駄が生じてしまいます。すべての小規模なフロントエンド開発チームには共通のニーズがあるため、そのような共通のニーズをサポートする専門チームがあれば、各小規模チームがこれらの反復的なタスクを実行するよりもはるかに効率的になります。さらに、インフラストラクチャのパフォーマンスと安定性もエンドユーザーエクスペリエンスに影響を与えるため、専門チームによる開発とメンテナンスが必要になります。

サービス指向プラットフォームのセキュリティ保護

「Ele.me」は中国でよく知られているオンライン食品配達注文プラットフォームです。中国国内の数百の都市、数千万人のユーザーをカバーし、数十万の飲食業者を集め、中国各地のユーザーに豊富で多様な便利な生活サービスを提供しています。 Ele.me のシニアテクニカルマネージャーである Zhang Long 氏の意見では、サービスプラットフォームとしての Ele.me のフロントエンドインフラストラクチャ構築の主なターゲットはユーザーであり、次にフロントエンド開発者です。エンドユーザーにとって、フロントエンドインフラストラクチャの構築は、アクセス速度の向上やサービスの安定性など、優れたユーザーエクスペリエンスを確保し、ユーザーが製品の魅力を感じることを可能にします。開発者にとって、フロントエンド インフラストラクチャの構築は、開発効率を向上させ、他の開発者とのコミュニケーションや協力を改善するためのサポート ツールやサービスを提供します。

Ele.meのフロントエンドインフラ構築への道

張龍氏によると、Ele.meに入社した当初は、大規模なフロントエンドのような部門はなく、いくつかのコードとコラボレーション仕様があるだけだったそうです。大規模なフロントエンド部門が設立された後、彼はアーキテクチャとモビリティチームを率いてチームの問題点のいくつかを解決しました。

最初に解決すべき問題は、非反復的な作業を開発することです。張龍先生はチームを率いて、Vue.js ベースのコンポーネント ライブラリ 2 つ、Element (PC) と Mint UI (モバイル) を開発し、一般に公開して、オープン ソース コミュニティで一定の影響力を獲得しました。

次に解決すべき問題は、オンライン ローンチをシンプルかつ自動化することだったので、Ele.me フロントエンド チームは、さまざまなテスト環境と本番環境を提供し、フロントエンド ビジネスの静的リソースをさまざまな環境に送信できる公開システムを開発しました。テスト環境は、開発者がセルフテストを実施したり、テスターが PRD に基づいてテストを実施したりするためのものであり、実稼働環境はエンドユーザー向けです。このシステムにより、公開時間は当初の 7 日間から現在の 5 分に短縮されました。

次に解決すべき問題は、より高速なアクセス速度を実現することです。そのため、Ele.me のフロントエンドチームは、複雑な構成の元の CDN サービスを放棄し、Github、Gitlab、NPM のリソースを直接プルできるリリース サービスに基づく CDN サービスを開始し、CDN の使用プロセスを大幅に簡素化しました。

*** サービスの安定性と信頼性を確保するため、ページのパフォーマンス、エラー報告、Nginx および CDN レベルを監視して、エンドユーザーの使用を確保します。

Ele.me のフロントエンド インフラストラクチャを構築する過程で、Zhang Long 氏と彼のチームは多くの困難に直面しました。張龍氏は、今年彼らが直面した大きな問題の 1 つである「リリース システム」の安定性について簡単に紹介しました。

Ele.me サービス チェーン内の特定のリンクは、一定期間実行した後に不可解にクラッシュします。しかし、製品が依存するサービスが大きくなると、製品の問題の根本原因を突き止めることが難しくなります。この製品は社内のフロントエンド開発者のみが使用しますが、問題の特定と解決には多くの時間がかかり、開発者のエクスペリエンスに大きな影響を与えます。そこで、Ele.me のフロントエンド チームは、この苦い経験から学んだ後、次の 2 つのことを行いました。

1. 予防:すべてのサービスを監視して、ユーザーが問題を報告する前に積極的に問題を検出します。

2. イベント後の復旧:主要サービスに災害復旧を追加して、障害が発生した場合に、整理されたサービス アーキテクチャとドキュメントに基づいて、通常のサービスにすばやく切り替え、事故サービスを迅速に復旧できるようにします。

リリースサービスアーキテクチャ

リリースサービスプロセス

安定こそが王様

***張龍氏は、フロントエンド、モバイル、バックエンドのインフラ構築の考え方が似ているため、純粋なフロントエンドインフラの仕事はあまりないと述べました。張龍氏は、サービスがユーザーに受け入れられるかどうかを決める重要な要素は「安定性」だと考えています。 「次の 3 つの点について明確に考える必要があります。サービスがクラッシュしたのはなぜか。クラッシュした場合、問題をどのように特定するか。問題を特定した後、どのように復元するか。安定性を確保できれば、スタートラインですでに勝利していることになります。」

【講師プロフィール】

[[207856]]

約10年間勤務している張龍氏は、現在、Ele.meのフロントエンドのシニアR＆Dマネージャーを務めています。 Ele.me に入社する前は、商用製品のフロントエンド コンポーネントの研究開発を 5 年間担当していました。 2015 年の初めに、彼はアーキテクチャおよびモビリティ チームの責任者として Ele.me のフロントエンドに加わりました。彼はチームを率いて、オープンソースでありオープンソース コミュニティで一定の影響力を獲得した 2 つの Vue.js ベースのコンポーネント ライブラリ、Element (PC) と Mint UI (モバイル) を開発しました。さらに、彼はチームを率いてフロントエンド インフラストラクチャを作成し、フロントエンド プロジェクトの開発と展開の効率を向上させました。

クーポンコード [2017WOTDSZ] を使用して、WOTD グローバル ソフトウェア開発テクノロジー サミットにご参加ください。 72時間限定で20%オフ！詳細については、wot..com をクリックしてください。

[51CTO オリジナル記事、パートナーサイトに転載する場合は、元の著者とソースを 51CTO.com として明記してください]