将 Bluebird 添加到 Aurelia 应用程序会引入错误答案

【问题标题】：Adding Bluebird to Aurelia app introduces bugs将 Bluebird 添加到 Aurelia 应用程序会引入错误
【发布时间】：2016-08-08 17:56:33
【问题描述】：

我今天在 IE Edge 中试用了我的 Aurelia 应用程序，加载首页大约需要 20 秒。切换页面也花费了不合理的时间，所以我用谷歌搜索了 aurelia edge performance，发现添加 Bluebird JS 库有助于提高所有浏览器的性能。除了在system.js 之前添加它的说明之外，我找不到确切如何添加此库的示例。

所以现在代替这个：

<script src="/jspm_packages/system.js"></script>
<script src="/config.js"></script>
<script>
    System.import('aurelia-bootstrapper');
</script>

我有这个：

<script src="//cdn.jsdelivr.net/bluebird/3.4.1/bluebird.min.js"></script>
<script src="/jspm_packages/system.js"></script>
<script src="/config.js"></script>
<script>
    System.import('aurelia-bootstrapper');
</script>

整个应用程序就像以前一样工作，我基本上尝试了每一个视图及其功能，除了一个的东西；

在每条路线成功时，我都会在 <html> 元素中添加一个 id（用于样式目的），以匹配当前查看的路线。所以在主页上我会有<html id="home-page"> 和在登录页面上<html id="login-page">。

这是在 app.js（根元素）的 attached() 方法中完成的，如下所示：

this.eventAggregator.subscribe('router:navigation:success', event => {
    if (event.instruction && event.instruction.router && event.instruction.router.currentInstruction && event.instruction.router.currentInstruction.config) {
        document.documentElement.id = event.instruction.router.currentInstruction.config.name + '-page';
    }
});

由于某种原因，在第一个页面加载时，并且仅在第一个页面加载时，此事件永远不会触发。转到另一条路线可以正常工作，然后返回第一次未触发事件的路线可以正常工作。只有在第一页加载时它才不会触发。

如果我移除 bluebird，它会重新开始工作。

有没有人任何知道是什么原因造成的？就像我说的，我所做的唯一更改是将 bluebird script 元素添加到 index.html。我对实际的应用程序代码没有做任何更改。

【问题讨论】：

标签： javascript bluebird aurelia

【解决方案1】：

所以我解决它的方法是我现在在加载时检查当前页面以及router:navigation:success 事件。有点烦人的是，这件事停止与 Bluebird 一起工作，但同时该网站现在可以在 IEdge 中使用，所以......

// Give <html> an ID representing the current page
if (this.router.currentInstruction) {
    document.documentElement.id = this.router.currentInstruction.config.name + '-page';
}

// Listen to route navigation changes and change the ID
this.navigationSubscription = this.eventAggregator.subscribe('router:navigation:success', event => {
    if (event.instruction && event.instruction.router && event.instruction.router.currentInstruction && event.instruction.router.currentInstruction.config) {
        document.documentElement.id = event.instruction.router.currentInstruction.config.name + '-page';
    }
});

【讨论】：