Question

我正在创建一个ember应用程序。现在我正在加载index.html文件中的所有js和css文件，如下所示：

<link type="text/css" rel="stylesheet" href="assets/css/gumby.css" media="all" />
<link type="text/css" rel="stylesheet" href="assets/css/pages/global.css" media="all" />
<link type="text/css" rel="stylesheet" href=assets/css/tooltipster.css" media="screen" />
<link type="text/css" rel="stylesheet" href="assets/css/jquery.fancybox.css" media="screen" />
<link type="text/css" rel="stylesheet" href="assets/css/pages/about.css" media="screen" />
<link type="text/css" rel="stylesheet" href="assets/css/pages/admin.css" media="screen" />
<link type="text/css" rel="stylesheet" href="assets/css/pages/global_print.css" media="print" />

js文件：

<script src="assets/js/libs/jquery-1.9.0.min.js"></script>
<script src="js/libs/handlebars-1.1.2.js"></script>
<script src="js/libs/ember-1.6.1.js"></script>
<script src="js/libs/ember-data.js"></script>
<script src="js/app.js"></script>
<script src="js/router.js"></script>
<script src="js/account.js"></script>
<script src="js/message.js"></script>
<script src="js/user.js"></script>
<script src="js/inquiry.js"></script>

我知道在应用程序启动时加载所有js和css文件并不是最佳做法。我想了解其他人如何为他们的应用做些什么，并且最好的方法是做到这一点。

Answer 1

我认为普遍接受的方法是样式表位于顶部，javascript依赖性位于底部，这似乎就是你如何组织起来的。

除了文件中的WHERE，您还要请求这些文件，请记住，每个单独的脚本或链接标记都是对服务器的单独回调。来回17次，不包括图像等，对您的用户来说可能是真正的减速带。

您是否考虑过将Ember-CLI用于您的项目？（http://www.ember-cli.com）它使这样的东西变得更容易。它将为您捆绑所有库和样式表，为您节省大量时间。如果您为样式表或javascript使用预处理器，则更是如此。

如果您不想使用Ember-CLI，有各种各样的实用程序和网站会为您压缩您的依赖。

ember.js加载多个css和js文件的最佳方法

1 个答案: