幾個月前，我在瀏覽科技推特時，看到了臭名昭著的布蘭登的這條推文：
如果你不知道，Brandon 創建了 AnalogJS，這是 Angular 的類似 NextJS 的元框架。我是他為 Angular 社群所做的事情的超級粉絲，所以我必須做出回應。他會第一個告訴你我想用解析器解決所有問題。
還有...
沒有一個...單一...按讚或回覆。
我在 Twitter 上發文不多，也沒有追蹤者，所以我沒有多想。
然而，我再次偶然看到這篇文章並閱讀了評論，我發現沒有人同意我的觀點！老實說，我想知道他們是否明白我在說什麼。
JavaScript 中其實有兩個流行的範例來載入資料。
這是我學習 Angular 的第一個方法。當我第一次學習 Fireship 的原始角度課程時，我甚至從未了解過解析器。解析器並不流行，我認為它被極大地誤解了。
Brandon 上面的範例顯示了元件呈現後正在載入的資料。這與其他框架的模式相同：<script> // Detect dark theme var iframe = document.getElementById('tweet-1836847595806732317-750'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1836847595806732317&theme=dark" } </script>
你注意到這裡的模式了嗎？伺服器端框架偏好載入函數（解析器），而客戶端框架則以反應方式取得訊號中的資料。但是...
Angular 不是伺服器端框架！
問題不在於 Angular 不是 SSR 框架，問題在於它假裝是。
現在我不希望 Angular 團隊添加我的所有功能請求。然而，如果主建構器能夠提供基本的 .env 支持，並且能夠使用 Angular Router 建立端點，那就太好了。布蘭登可以處理剩下的事情。
我仍然很瘋狂，因為我無法將基本的 Angular SSR 應用程式部署到 Vercel。
我在 2019 年讀過一篇關於解析器的文章，其中說解析器的用例「非常罕見」。基本上，您應該只在獲取可以快速加載的資料時使用它們。好的，同意。實際上，您只會在極少數用例中載入緩慢的資料。您希望您的網站或應用程式能夠快速運作。
？到底是怎麼回事老兄...
喬許莫羅尼會說什麼？
你不應該在 Angular 中使用 RxJS，除非你需要處理具有競爭條件的非同步事件或協調複雜的資料流。
他指的是 Signals VS Observables，所以我不知道。儘管如此，我認為您應該默認獲取解析器，直到您擁有這些高級用例。
如果您正在建立專業的 SSR 應用程序，您將需要從資料庫產生 SEO。您必須使用解析器，或者使用 PendingTask 手動暫停元件加載，這非常時髦。
在模擬中，我懷疑人們僅在基於文件的端點內部進行提取，或者他們在無關緊要的地方生成靜態頁面。
我最喜歡的兩個框架的程式模式是截然相反的。
解決解析器載入緩慢的一個流行答案是 HTTP 流。 NextJS 和 SvelteKit 支持這一點，但 Angular 拒絕了。
？
目前，解析器中的任何內容都將被獲取兩次（伺服器客戶端）。這也需要在未來處理。 ？解析器應該會自動傳遞狀態...在解析器中使用我的 useAsyncTrasferState 函數。
為了簡潔起見，我使用 ngxtension 進行演示，但結果是相同的。
id = injectParams('id');
idNumber = computed(() => Number(this.id()));
todo = derivedAsync<Todo>(() =>
fetch(`https://jsonplaceholder.typicode.com/todos/${this.id()}`).then(
(response) => response.json()
)
);
prevId = computed(() => Math.max(this.idNumber() - 1, 1));
nextId = computed(() => this.idNumber() + 1);
todo = injectRouteData<Todo>('data');
idNumber = computed(() => this.todo()!.id);
prevId = computed(() => Math.max(this.idNumber() - 1, 1));
nextId = computed(() => this.idNumber() + 1);
這是從解析器載入的。
import { ResolveFn } from '@angular/router';
export const routeResolverResolver: ResolveFn<boolean> = async (route) => {
const todoId = route.paramMap.get('id');
if (!todoId) {
throw new Error('Todo ID is missing in the route!');
}
// Fetch the todo from the API
const response = await fetch(`https://jsonplaceholder.typicode.com/todos/${todoId}`);
if (!response.ok) {
throw new Error('Failed to fetch the todo');
}
return await response.json();
};
在這個特定的演示中，效果版本中有“閃爍”，而解析器版本則沒有閃爍。我相信解析器在這個用例中更好。
你覺得怎麼樣？
？由於 Vercel 不支援 SSR 部署，因此此示範僅在用戶端載入解析器。這意味著路由只能在主頁上使用。
我想說它是非同步獲取的生命維持。實際上，Angular SSR 用戶應該更多地考慮此用例的解析器，而 SvelteKit 用戶應該考慮在 $effect() 中載入更多用例。但也許這就是重點？用戶群不同。
我仍在學習，但這些問題讓我著迷。希望我們在這兩個生態系統中看到更多的改變。
J
以上是Angular 解析器有生命維持嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
