Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Wouldn't it be better to load JavaScript in the body? #33

Open
blizarazu opened this issue Jan 10, 2016 · 1 comment
Open

Wouldn't it be better to load JavaScript in the body? #33

blizarazu opened this issue Jan 10, 2016 · 1 comment

Comments

@blizarazu
Copy link

Usually it is recommended to place the <script> tags right before closing the body tag (</body>) so that the browser's parser doesn't get blocked until all the JavaScript is downloaded. Wouldn't it be better to place the <script> tag at the bottom of the body of index.html?

<!DOCTYPE html>
<html ng-app="<%=appName%>" ng-controller="AppController">
<head>
    <title ng-bind="pageTitle"></title>

    <!-- font awesome from BootstrapCDN -->
    <link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">

    <!-- compiled CSS --><% styles.forEach( function ( file ) { %>
    <link rel="stylesheet" type="text/css" href="<%= file %>" /><% }); %>
</head>
<body>
    <header>
        <nav class="container navbar-default">
            <ul class="nav navbar-nav">
                <li ui-sref-active="active">
                    <a ui-sref="home">Home</a>
                </li>
                <li ui-sref-active="active">
                    <a ui-sref="about">About</a>
                </li>
            </ul>
        </nav>
    </header>

    <div class="container" ui-view="main"></div>

    <footer class="container">
        (c) <%= date %> <%= author %>
    </footer>

    <!-- compiled JavaScript --><% scripts.forEach( function ( file ) { %>
    <script type="text/javascript" src="<%= file %>"></script><% }); %>
</body>
</html>
@blizarazu blizarazu changed the title Why not load JavaScript in the body? Wouldn't it be better to load JavaScript in the body? Feb 7, 2016
@thardy
Copy link
Owner

thardy commented Mar 24, 2016

That practice is generally good for pages that use javascript to provide some small effects to the page itself, but still need to load very quickly. When you're talking about a SPA, you're usually dealing with a web application, and having the application fully loaded and responsive is usually more valuable than having the first page load quickly.

My advice is to use static html for your landing pages, marketing site, SEO-friendly, lead-generation websites, and use a SPA for your web applications. On the former, speed is paramount on the first hit. On the latter, functionality is the top priority, and we can settle for speed after the first hit. Having everything loaded and ready to go once the user starts clicking is more important. Once we get some traction on javascript loaders/managers in the browser, we'll start thinking about a hybrid approach, but I haven't needed to merge the two yet. I usually go one route or the other.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@thardy @blizarazu