ドキュメントエディタの構造:ONLYOFFICEエディタのオンラインバージョンとオフラインバージョンの共通コード

今日が何の日かと聞かれたら、今日は大日だと答えます。 ついにONLYOFFICE デスクトップエディターがリリースされた日。 ブラウザ/インターネットなしで動作し、プリンタに直接ドキュメントを送信する同じもの。



はい、私たちは長い間、オンラインエディターのみに専念し、その後オフラインアプリケーションを作成しました。 まず、オンラインエディターの人気が高まっているにもかかわらず、ほとんどのユーザーは引き続きデスクトップを好んでいます。 第二に、私たち自身はブラウザの制限から逃れ、編集者との作業を高速化することを長い間望んでいました。



オンラインエディターとの関係におけるデスクトップエディターの主な特徴は、共通のソースコードを共有していることです。 この記事では、このようにデスクトップを作成することにした理由を少し説明し、その解剖学の秘密、すなわちオンラインバージョンとの違い、それらの配置方法、今後の変更予定を明らかにします。







オンライン上のオフラインエディターの利点は何ですか





テキストのこのまだ導入部では、私たちは実際にオンライン編集者を愛しているが、常にではないことを思い出します。 いくつかの点は非常に動揺しています。 文書から何かをコピーしようとしているが、キーボードを使用することを強く推奨されているユーザーの混乱した顔を見てください。 そして、ちょうど印刷したかった今、PDFをダウンロードしたこの貧しい人? それとも、切り刻まれたインターネットでは惨めなのでしょうか? 一般的に、誰もが私たちがどこに向かっているのかをすでに推測しています。 デスクトップエディターには否定できない利点があります。これらは次のとおりです。





だから、デスクトップを作りたいと確信していた。 しかし、我々は質問に答えなければなりませんでした:どのように?



方法論





放棄したオプション :ネイティブアプリケーション。 また、ネイティブアプリケーションほどクールなものはないと考えていますが、不可抗力の状況により、その実装の複雑さとコストのために、このアイデアを捨てざるを得ませんでした。



このオプションを選択した場合、エディターのコードと視覚化全体を書き換える必要があります。 さらに、将来的には、更新プログラムをWebバージョンのエディターと同期する問題が生じるでしょう。 同じことをする2つのコードを取得し、それぞれに何かを修正する二重の仕事をします。



選択したオプション :既存のONLYOFFICEエディターのjsコードを使用します。 このアプローチの利点は明らかです。開発はそれほど複雑ではなく、コードが同じであるため、Webバージョンとデスクトップの両方を更新するのが便利です。



私たちが望んだもの



1. 1つのjs / c ++通信コード。



2.クロスプラットフォームGUI。



3.将来、ネイティブレンダリングスキームに切り替える機会があります。 エディターのコード自体はJavaScriptのままですが、レンダリング(アプリケーションのメインブレーキ)をやり直すことができるはずです。



私たちが選んだもの



1.最初の要件を満たすために、すべてのプラットフォームにブラウザーエンジンが必要でした。 ちなみに、サーバーでファイルのバージョンを作成するために使用されるV8に精通しているため、もともとは何らかの形でChromiumを使用していました。



2.ここでも、長い間考えていませんでした。 Qtは非常に一般的で便利です。 さらに、このライブラリを使用した経験もありました。



3.これまでのところ、これらは計画にすぎません。 ただし、ポイントは、jsエディターが個別にスピンして、すべての機能を実装し、テキストの表示、測定がネイティブになることです。 ところで、これがiOS用のモバイルアプリケーションを既に持っている方法です。



レンダリングについて少し





これまでのところ、ネイティブレンダリングは計画内にあるため、条件付きクロスプラットフォームWebViewが必要でした。 いくつかのアイデアがありました。



オプション:



1.とにかくQtが選択されたため、すぐに使用できるソリューション QWebViewまたはQWebEngineViewのいずれか。



もちろん、それらのいずれかで停止した場合、主な利点は、すべての主要な作業がすでに行われていることです。 それはいいように思えますが、短所はまだ勝っています。



QWebViewは開発者によって開発されていません。非常に遅く、アプリケーションと同じプロセスで動作します。 設計者は、一度に複数のドキュメントを開いて作業することを意味する「タブ付き」インターフェースが必要だったため、私たちにとってこれは重要でした。 したがって、1つのドキュメントに問題があると、すべてのタブで問題が発生します。



QWebEngineView-かなり新しいコントロールで、積極的に開発されており、Chromium'eに正確に基づいています。 独自のプロセスで動作し、QWebViewよりもはるかに高速です。 しかし、彼は合わなかった。 まず、jsコードが機能するプロセスでネイティブコードを使用した通常の作業が不可能であるためです。 このような通信はWebソケットを介して行われるため、不便です。 第二に、4Kモニターでは、何らかの理由でレンダリングの速度が低下し始めました。



2. 純クロム 。 長所-速度と完全な機能。 マイクロソフトから最近リリースされたVisual Studio Codeは、そのように実装されており、この方法に真剣に注意を払っています。



3. Chromium Embedded Framework 。 これは便利なChromiumラッパーで、定期的にアセンブルされたバージョン(cefbuilds.com)がレイアウトされています。 Plusは、2番目のポイントよりもはるかに簡単です。 マイナス-機能の一部を失います(多くはラップされてAPIとして発行されますが、すべてではありません)。



標準のアプローチはすぐに拒否しましたが、オプション2と3が思いつきました。 これらのうち、よりシンプルなソリューション、つまりChromium Embedded Frameworkを選択しました。 その結果、cefに基づいて、ニーズを完全に満たすCefWebViewを実装しました。



応募スキーム



結果のアプリケーションは次のように機能します。







つまり、V8コンテキストを作成するときにオブジェクトを埋め込み、jsからネイティブコードにアクセスできるようにします。 さらに、データを別のプロセス(たとえば、ui)に転送する必要がある場合、メッセージを送信することにより、cefに組み込まれたプロセス間通信メカニズムを使用します。 同様に、他のプロセスからjsプロセスにメッセージを送信します。



MacOS用のXcode





しかし、最終的にすべてが計画どおりに実装されたわけではありません。 たとえば、MacOS用のアプリケーションはQtで作成されたのではなく、Xcodeを使用して作成されました。



事実、エディターのあるタブにはQTabWidgetを使用しているため、MacOSではかなり遅くなります。 これは基本的にタブを単にドラッグアンドドロップすることですが、すべてが正常に機能するためには、このコントロールをゼロから実装する必要がありました。 これはしたくありませんでした。 それでも、私たちは少しネイティブなインターフェースを持っているので、Xcodeを使用してMacOS用に開発する方がはるかに便利でした。



まとめ





意図したとおりになりました。 アプリケーションはすべてのシステムで動作し、尊厳をもってそれを行います。 オフラインで作業したい人に便利で適していると同時に、ポータルを接続する可能性を示唆しています。これにより、共同編集ツールを使用して、他のチームメンバーとドキュメントを共同作業できます。



私たちにとって、これは新しい興味深い活動分野であり、私たちが愛することを継続的に行う機会です。 さらなる計画? たくさんあります。 まず、エディター自体のバグ(JSコード)を修正し、必要な機能(脚注、目次、ピボットテーブル、アニメーション、3Dエフェクト)を補完する必要があります。 そして-ネイティブレンダリングに切り替えます。



PSあなたは私たちの公式サイトからアプリケーションをダウンロードできます。 また、(ほとんど忘れてしまった!)-ONLYOFFICEデスクトップエディターは個人での使用は無料です。 ONLYOFFICEクラウドソリューションのユーザーは、1年または3年間サブスクリプションの支払いをしたことがあるため、デスクトップアプリケーションを無料で入手できます。 ONLYOFFICE Enterprise Editionのサーバーバージョンのユーザーの場合、デスクトップアプリケーションの25ライセンスがサブスクリプション価格に既に含まれています。



All Articles