介紹
Boson 是一個創新的跨平臺桌面應用程序開發平臺,它釋放了 Web 技術(PHP、JavaScript、HTML、CSS)的強大功能以及本機匯編的優勢。它的主要功能是將基于 Chromium 的 WebView 引擎和 PHP 解釋器直接集成到可執行文件應用程序中。
該解決方案允許開發人員:
- 使用熟悉的堆棧技術 — 通過 HTML/CSS 創建接口并在 PHP(使用 JavaScript 元素)中實現邏輯,而無需學習特定于平臺的語言。
- 通過 Chromium 引擎實現穩定渲染,在 Windows、macOS 和 Linux 上提供可靠的用戶體驗 。
- 減少單個代碼庫計數器的開發時間 — 更改在所有平臺之間自動同步。
- 簡化分發 — 自包含的二進制文件不需要安裝額外的運行時。
Boson 的設計功能使其成為想要超越瀏覽器應用程序的 Web 開發人員的正確選擇。該庫完全允許使用本機 API,而不是通常的工作流程,即自動將 Web 組件轉換為桌面界面?,F成的應用程序保留了本機程序的所有優勢,包括對文件系統和系統資源的訪問,同時保持跨平臺“開箱即用”。
Boson 不是什么?
Boson 不是一個 GUI 框架。 我們不是在這里決定您的應用程序的外觀或感覺。使用最適合您的工作流程的任何前端堆棧 — React、Angular、Vue、Svelte、jQuery,或者只是經典的 HTML 和 CSS。更喜歡 Bootstrap、Bulma 還是 Tailwind?去做吧。您的 UI,您的規則。
Boson 不啟動 HTTP 服務器 (與 NativePHP 不同)也不依賴 Node.js。沒有不穩定的解決方法,沒有額外的層,也沒有不必要的數據轉換。只需直接、簡化地訪問渲染器 - 所有這些都在一個統一的過程中完成。
Boson 不依賴繁重的依賴項 ,也不是 Electron 或 NativePHP 的分支。它利用了作系統上已有的工具,使您的應用程序保持輕量級。Boson 不像典型的 Electron 或 NativePHP 應用程序那樣消耗數百兆字節,而是將其占用空間保持在幾千字節——通過設計高效。
Boson 也沒有像 JPHP (Devel Studio/Devel Next) 那樣重新發明 PHP。它使用您已經熟悉和喜愛的現代 PHP——沒有分叉,沒有驚喜。
忘記復雜的設置或自定義 PHP 擴展。只需運行一個命令即可開始: composer require boson-php/runtime
— 然后您就可以開始工作了。
安裝
運行時 — 充當 PHP 代碼和底層作系統之間的橋梁。這是您可以在運行時和開發期間使用的主要 API編譯器 – 允許您將工作結果構建到完成的項目中,以便分發。
運行時
Boson 運行時提供了庫的核心,并允許您運行出色的應用程序。
Library 作為 Composer 存儲庫提供,可以使用以下命令安裝在項目的根目錄中:
composer require boson-php/runtime
不要忘記在您的應用程序中包含自動加載文件。
<?php
require __DIR__ . '/vendor/autoload.php';
$app = new Boson\Application();
編譯器
Boson 編譯器使您能夠將工作結果組裝成最終產品。也就是說,導入到目標平臺的可執行文件中。
Library 作為 Composer 存儲庫提供,可以使用以下命令安裝在項目的根目錄中:
composer require boson-php/compiler --dev
編譯器只是開發時需要的,不是代碼執行時需要的,因此建議將其作為 --dev
包包含在內。
環境要求:PHP 8.4+
開啟 ext-ffi
擴展
案例
您可以在 Web Components 中使用 Twig。為此,您需要遵循幾個簡單的步驟。
1. 在您的項目中安裝 Twig 組件:
composer require twig/twig
2. 創建 Twig 組件
之后,您應該創建一個支持 twig 渲染的組件。
use Boson\WebView\Api\WebComponents\ReactiveContext;
useBoson\WebView\Api\WebComponents\WebComponent;
useBoson\WebView\WebView;
useTwig\Environment;
useTwig\TemplateWrapper;
abstractclass TwigComponent extends WebComponent
{
/**
* In this case, the template will be initialized
* once during the first render.
*/
private TemplateWrapper $template {
get => $this->template ??= $this->twig->createTemplate(
template: $this->renderTwig(),
);
}
publicfunction __construct(
protected readonly Environment $twig,
ReactiveContext $ctx,
WebView $webview,
) {
parent::__construct($ctx, $webview);
}
abstractprotectedfunction renderTwig(): string;
/**
* Override the default render behavior by
* redirecting it to a Twig template
*/
#[\Override]
finalpublicfunction render(): string
{
return$this->template->render(\get_object_vars($this));
}
}
3. 創建 Instantiator
現在我們需要定義這些組件的確切創建方式,為此,我們應該創建自己的實例化器,它將按需返回新組件。
use Boson\WebView\Api\WebComponents\Instantiator\WebComponentInstantiatorInterface;
useBoson\WebView\Api\WebComponents\ReactiveContext;
useBoson\WebView\WebView;
useTwig\Environment;
useTwig\Loader\ArrayLoader;
final readonly class TwigComponentInstantiator implements
WebComponentInstantiatorInterface
{
private Environment $twig;
publicfunction __construct()
{
$this->twig = new Environment(new ArrayLoader());
}
privatefunction isTwigComponent(string $component): bool
{
return \is_subclass_of($component, TwigComponent::class);
}
publicfunction create(WebView $webview, ReactiveContext $context): object
{
$component = $context->component;
// Pass twig as a first argument in case of passed
// component extends from TwigComponent class
if ($this->isTwigComponent($component)) {
returnnew $component($this->twig, $context, $webview);
}
returnnew $component($context, $webview);
}
}
4. 注冊實例化器
要確定應使用不同的實例化器,可以在 webview 配置中指定它。
$webComponentsConfig = new WebComponentsCreateInfo(
instantiator: new TwigComponentInstantiator(),
);
$applicationConfig = new ApplicationCreateInfo(
window: new WindowCreateInfo(
webview: new WebViewCreateInfo(
webComponents: $webComponentsConfig,
),
),
);
$app = new Boson\Application($applicationConfig);
5. Twig 組件
現在我們可以創建自定義 twig 組件了!
class MyTwigComponent extends TwigComponent
{
protected array $items = [1, 2, 3];
protected function renderTwig(): string
{
return <<<'twig'
<ul>
{% for item in items %}
<li>{{ item }}</li>
{% endfor %}
</ul>
twig;
}
}
要注冊和檢查,只需寫幾行
$app->webview->defineComponent('my-list', MyTwigComponent::class);
$app->webview->html = '<my-list />';
?