perf: prefetch all internal links (#981)

src/routes/_components/NavItem.html

@@ -2,6 +2,7 @@
    aria-label={ariaLabel}
    aria-current={selected}
    on:click="onClick(event)"
+   rel="prefetch"
    {href} >
   <div class="nav-icon-and-label">
     {#if name === 'notifications'}

src/routes/_components/NotLoggedInHome.html

@@ -11,7 +11,7 @@
 
       <p>Read the <ExternalLink href="https://nolanlawson.com/2018/04/09/introducing-pinafore-for-mastodon/">introductory blog post</ExternalLink>, or get started by logging in to an instance:</p>
 
-      <p style="text-align: right;"><a class="button primary" href="/settings/instances/add">Add instance</a></p>
+      <p style="text-align: right;"><a class="button primary" rel="prefetch" href="/settings/instances/add">Add instance</a></p>
     </div>
   </FreeTextLayout>
 </HiddenFromSSR>

src/routes/_components/community/PageListItem.html

@@ -1,5 +1,5 @@
 <li class="page-list-item">
-  <a {href}>
+  <a {href} rel="prefetch">
     <svg class="page-list-item-svg">
       <use xlink:href={icon} />
     </svg>

src/routes/_components/compose/ComposeAuthor.html

@@ -1,9 +1,10 @@
 <a href="/accounts/{verifyCredentials.id}"
+   rel="prefetch"
    class="compose-box-avatar"
    aria-label="Profile for {accessibleName}">
   <Avatar account={verifyCredentials} size="small"/>
 </a>
-<a class="compose-box-display-name" href="/accounts/{verifyCredentials.id}">
+<a class="compose-box-display-name" href="/accounts/{verifyCredentials.id}" rel="prefetch">
   <AccountDisplayName account={verifyCredentials} />
 </a>
 <span class="compose-box-handle">
@@ -72,4 +73,4 @@
       }
     }
   }
-</script>
+</script>

src/routes/_components/profile/AccountProfileDetails.html

@@ -11,6 +11,7 @@
   <a class="account-profile-details-item"
      href='/accounts/{account.id}/follows'
      aria-label={followingLabel}
+     rel="prefetch"
   >
     <span class="account-profile-details-item-title">
       Follows
@@ -22,6 +23,7 @@
   <a class="account-profile-details-item"
      href='/accounts/{account.id}/followers'
      aria-label={followersLabel}
+     rel="prefetch"
   >
     <span class="account-profile-details-item-title">
       Followers

src/routes/_components/search/SearchResult.html

@@ -1,5 +1,5 @@
 <li class="search-result">
-  <a {href} class="search-result-anchor">
+  <a {href} class="search-result-anchor" rel="prefetch">
     <slot></slot>
   </a>
 </li>
@@ -33,4 +33,4 @@
       padding: 15px 10px;
     }
   }
-</style>
+</style>

src/routes/_components/settings/SettingsListButton.html

@@ -1,4 +1,4 @@
-<a {href} aria-label={ariaLabel || label} class="settings-list-button {className ? className : ''}">
+<a {href} rel="prefetch" aria-label={ariaLabel || label} class="settings-list-button {className ? className : ''}">
   <span>
     {label}
   </span>

src/routes/_components/settings/SettingsNavItem.html

@@ -1,5 +1,6 @@
 <a class="settings-nav-item {className}"
    aria-label={ariaLabel}
+   rel="prefetch"
    {href} >
   {label}
 </a>
@@ -19,4 +20,4 @@
       ariaLabel: ({ page, name, label }) => page === name ? `${label} (current page)` : label
     }
   }
-</script>
+</script>

src/routes/_components/status/StatusAuthorName.html

@@ -1,4 +1,5 @@
 <a class="status-author-name {isStatusInNotification ? 'status-in-notification' : '' } {isStatusInOwnThread ? 'status-in-own-thread' : ''}"
+   rel="prefetch"
    href="/accounts/{originalAccountId}"
    title="{'@' + originalAccount.acct}"
    focus-key={focusKey}
@@ -44,4 +45,4 @@
       AccountDisplayName
     }
   }
-</script>
+</script>

src/routes/_components/status/StatusDetails.html

@@ -25,6 +25,7 @@
     {/if}
   {/if}
   <a class="status-favs-reblogs status-reblogs"
+     rel="prefetch"
      href="/statuses/{originalStatusId}/reblogs"
      aria-label={reblogsLabel}>
     <svg class="status-favs-reblogs-svg">
@@ -33,6 +34,7 @@
     <span>{numReblogs}</span>
   </a>
   <a class="status-favs-reblogs status-favs"
+     rel="prefetch"
      href="/statuses/{originalStatusId}/favorites"
      aria-label={favoritesLabel}>
     <svg class="status-favs-reblogs-svg">

src/routes/_components/status/StatusHeader.html

@@ -13,6 +13,7 @@
       </span>
     {:else}
       <a href="/accounts/{accountId}"
+         rel="prefetch"
          class="status-header-author"
          title="{'@' + account.acct}"
          focus-key={focusKey} >
@@ -124,4 +125,4 @@
       }
     }
   }
-</script>
+</script>

src/routes/_components/status/StatusMentions.html

@@ -8,6 +8,7 @@
           <!-- empty space -->
         {/if}
         <a href="/accounts/{mention.id}"
+           rel="prefetch"
            title="@{mention.acct}"
            focus-key="status-mention-link-{uuid}-{mention.id}">
           @{mention.username}

src/routes/_components/status/StatusRelativeDate.html

@@ -1,5 +1,6 @@
 <a class="status-relative-date {isStatusInNotification ? 'status-in-notification' : '' }"
    href="/statuses/{originalStatusId}"
+   rel="prefetch"
    focus-key={focusKey}
 >
   <time datetime={createdAtDate} title={absoluteFormattedDate}

src/routes/_components/status/StatusSidebar.html

@@ -1,4 +1,5 @@
 <a class="status-sidebar size-{size}"
+   rel="prefetch"
    href="/accounts/{originalAccountId}"
    focus-key={focusKey}
    aria-hidden="true"
@@ -40,4 +41,4 @@
       size: ({ isStatusInOwnThread }) => isStatusInOwnThread ? 'medium' : 'small'
     }
   }
-</script>
+</script>

src/routes/_pages/settings/instances/index.html

@@ -24,10 +24,10 @@
     </SettingsListRow>
     {/each}
   </SettingsList>
-  <p><a href="/settings/instances/add">Add another instance</a></p>
+  <p><a rel="prefetch" href="/settings/instances/add">Add another instance</a></p>
   {:else}
   <p>You're not logged in to any instances.</p>
-  <p><a href="/settings/instances/add">Log in to an instance</a> to start using Pinafore.</p>
+  <p><a rel="prefetch" href="/settings/instances/add">Log in to an instance</a> to start using Pinafore.</p>
   {/if}
 </SettingsLayout>
 <style>