Skip to content

Commit

Permalink
feature: #1231: speed improvement;
Browse files Browse the repository at this point in the history
  • Loading branch information
migbash committed Apr 25, 2023
1 parent 2fa8695 commit 31d839d
Show file tree
Hide file tree
Showing 16 changed files with 286 additions and 574 deletions.
75 changes: 39 additions & 36 deletions src/lib/components/_main_/footer/_Footer.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
<script lang="ts">
import { browser } from '$app/environment';
import { page } from '$app/stores';
import SeoBox from '$lib/components/SEO-Box.svelte';
import type { Cache_Single_Lang_Footer_Translation_Response } from '$lib/models/_main_/footer/types';
import { sessionStore } from '$lib/store/session';
import { dlog, FT_W_STY, FT_W_TAG, FT_W_TOG } from '$lib/utils/debug';
Expand Down Expand Up @@ -104,42 +105,44 @@
[ℹ] FOOTER SEO
-->
{#if FOOTER_TRANSLATION_DATA != undefined && !hideSEO}
<!-- [ℹ] betarena-logo-homepage-correct-url
-->
<p>{logoLink}</p>
<!-- [ℹ] nav-links-SEO
-->
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.latest_news}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.about_us}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.betting_tips}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.privacy}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.social_networks}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.terms}
</p>
<!-- [ℹ] nav-links-social-links
-->
{#each FOOTER_TRANSLATION_DATA.scores_footer_links.social_networks as social_network}
<p>
{social_network[1]}
</p>
{/each}
<SeoBox>
<!-- [ℹ] betarena-logo-homepage-correct-url
-->
<p>{logoLink}</p>
<!-- [ℹ] nav-links-SEO
-->
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.latest_news}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.about_us}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.betting_tips}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.privacy}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.social_networks}
</p>
<p>
{FOOTER_TRANSLATION_DATA.scores_footer_links
.terms}
</p>
<!-- [ℹ] nav-links-social-links
-->
{#each FOOTER_TRANSLATION_DATA.scores_footer_links.social_networks as social_network}
<p>
{social_network[1]}
</p>
{/each}
</SeoBox>
{/if}

<!--
Expand Down
53 changes: 28 additions & 25 deletions src/lib/components/_main_/header/Header.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ COMPONENT JS - BASIC
import type { Cache_Single_Lang_Header_Translation_Response } from '$lib/models/_main_/navbar/types';
import type { GeoJsResponse } from '$lib/types/geojs-types';
import SeoBox from '$lib/components/SEO-Box.svelte';
import { db_firestore } from '$lib/firebase/init';
import { sessionStore } from '$lib/store/session';
import { platfrom_lang_ssr, viewport_change } from '$lib/utils/platform-functions';
Expand Down Expand Up @@ -532,31 +533,33 @@ COMPONENT JS - BASIC
TODO:FIXME: not generating for each LANG
-->
{#if HEADER_TRANSLATION_DATA != undefined && !hideSEO}
<!--
[ℹ] main-homepage-link-in-all-avaialble-languages
-->
{#each HEADER_TRANSLATION_DATA.langArray as item}
{#if item != 'en'}
<!--
[ℹ] content here
-->
<a

href={$page.url.origin + '/' + item}
>
<p>{$page.url.origin + '/' + item}</p>
</a>
{:else}
<!-- [ℹ] content here
-->
<a

href={$page.url.origin}
>
<p>{$page.url.origin}</p>
</a>
{/if}
{/each}
<SeoBox>
<!--
[ℹ] main-homepage-link-in-all-avaialble-languages
-->
{#each HEADER_TRANSLATION_DATA.langArray as item}
{#if item != 'en'}
<!--
[ℹ] content here
-->
<a

href={$page.url.origin + '/' + item}
>
<p>{$page.url.origin + '/' + item}</p>
</a>
{:else}
<!-- [ℹ] content here
-->
<a

href={$page.url.origin}
>
<p>{$page.url.origin}</p>
</a>
{/if}
{/each}
</SeoBox>
{/if}

<!--
Expand Down
Original file line number Diff line number Diff line change
@@ -1,23 +1,20 @@
<!-- ===============
COMPONENT JS (w/ TS)
COMPONENT JS (w/ TS)
==================== -->
<script lang="ts">
// [ℹ] svelte-imports;
import { onMount } from 'svelte';
// [ℹ] external `exports` imports;
import { get } from '$lib/api/utils';
import { userBetarenaSettings } from '$lib/store/user-settings';
// [ℹ] external components import;
import SeoBox from '$lib/components/SEO-Box.svelte';
import WidgetNoData from '$lib/components/Widget-No-Data.svelte';
import WidgetTitle from '$lib/components/Widget-Title.svelte';
import type {
Cache_Single_Geo_GoalScorers_Translation_Response,
Cache_Single_Lang_GoalScorers_Translation_Response
} from '$lib/models/home/best_goalscorer/types';
import BestGoalscorersWidgetContentLoader from './_Best_Goalscorers_Widget_ContentLoader.svelte';
import BestGoalscorerRow from './_Best_Goalscorer_Row.svelte';
// [ℹ] key component assets;
import { userBetarenaSettings } from '$lib/store/user-settings';
import { BG_W_H_STY, BG_W_H_TAG, BG_W_H_TOG, dlog } from '$lib/utils/debug';
import no_featured_match_visual from './assets/no_featured_match_visual.svg';
import no_featured_match_visual_dark from './assets/no_featured_match_visual_dark.svg';
import { onMount } from 'svelte';
import BestGoalscorerRow from './_Best_Goalscorer_Row.svelte';
import BestGoalscorersWidgetContentLoader from './_Best_Goalscorers_Widget_ContentLoader.svelte';
// [ℹ] main component variables;
export let BEST_GOAL_SCORERS_DATA_SEO: Cache_Single_Lang_GoalScorers_Translation_Response;
Expand Down Expand Up @@ -144,122 +141,74 @@
COMPONENT HTML
==================== -->

<div>
<!-- [ℹ] SEO-DATA-LOADED
-->
<SeoBox>
<!-- used,
{#if !loaded}
<!-- [ℹ] SEO-BOX
-->
<div>
<h2>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.best_goal_scorers}
</h2>
<p>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.goals}
</p>
<p>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.odds}
</p>
<p>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.player}
</p>
<p>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.show_more_players}
</p>
<!-- [ℹ] list all of the players in the DB
-->
<div id="seo-featured-betting-site-box">
<h2>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.best_goal_scorers}
</h2>
<p>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.goals}
</p>
<p>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.odds}
</p>
<p>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.player}
</p>
<p>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.show_more_players}
</p>
<!-- [ℹ] list all of the players in the DB
-->
{#each BEST_GOAL_SCORERS_DATA_SEO.top_geo_goalscorer_players as WIDGET_BEST_PLAYER}
<p>{WIDGET_BEST_PLAYER.common_name}</p>
{/each}
</div>
{/if}
{#each BEST_GOAL_SCORERS_DATA_SEO.top_geo_goalscorer_players as WIDGET_BEST_PLAYER}
<p>{WIDGET_BEST_PLAYER.common_name}</p>
{/each}
</div>
</SeoBox>

<!-- [ℹ] NO BEST PLAYERS AVAILABLE PLACEHOLDER
<div>
<!--
[ℹ] NO BEST PLAYERS AVAILABLE PLACEHOLDER
-->
{#if noBestPlayers && !loaded}
<!-- [ℹ] title of the widget
-->
<h2
class="s-20 m-b-10 w-500 color-black-2"
style="margin-top: 0;"
class:color-white={$userBetarenaSettings.theme ==
'Dark'}
>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.best_goal_scorers}
</h2>

<!-- [ℹ] no-matches-avaiable-placeholder container
-->
<div
id="no-best-players-box"
class="row-space-start"
class:dark-background-1={$userBetarenaSettings.theme ==
'Dark'}
>
<!-- [ℹ] no-matches-visual
-->
{#if $userBetarenaSettings.theme == 'Dark'}
<img
src={no_featured_match_visual_dark}
alt="no-featured-match-visual_dark"
width="80px"
height="80px"
class="m-r-20"
/>
{:else}
<img
src={no_featured_match_visual}
alt="no-featured-match-visual"
width="80px"
height="80px"
class="m-r-20"
/>
{/if}

<!-- [ℹ] container w/ text
-->
<div>
<p class="s-16 m-b-8 w-500">
No Best Players Available
</p>
<p class="s-16 color-grey w-400">
Sorry, at this time there is no best
players available!
</p>
</div>
</div>
<WidgetNoData
WIDGET_TITLE={BEST_GOAL_SCORERS_DATA_SEO?.translations?.widget_translations?.best_goal_scorers}}
NO_DATA_TITLE={"No Best Players Available"}
NO_DATA_DESC={"Sorry, at this time there is no best players available!"}
/>
{/if}

<!-- [ℹ] BEST GOALSCORERS WIDGET DATA
<!--
[ℹ] BEST GOALSCORERS WIDGET DATA
-->
{#if !noBestPlayers && !refresh}
<!-- [ℹ] promise is pending
<!--
[ℹ] promise is pending
-->
{#await widgetInit()}
<BestGoalscorersWidgetContentLoader />

<!-- [ℹ] promise was fulfilled
<!--
[ℹ] promise was fulfilled
-->
{:then data}
<!-- [ℹ] wiget-title -->
<h2
id="widget-title"
class="s-20 m-b-10 w-500 color-black-2"
style="margin-top: 0;"
class:color-white={$userBetarenaSettings.theme ==
'Dark'}
>
{BEST_GOAL_SCORERS_DATA_SEO.translations
.widget_translations.best_goal_scorers}
</h2>

<!-- [ℹ] widget-component -->
<WidgetTitle
WIDGET_TITLE={BEST_GOAL_SCORERS_DATA_SEO?.translations?.widget_translations?.best_goal_scorers}
OVERRIDE_COLOR={true}
/>

<!--
[ℹ] widget-component
-->
<div
id="featured-list-container"
class:dark-background-1={$userBetarenaSettings.theme ==
Expand Down Expand Up @@ -350,19 +299,6 @@
COMPONENT STYLE
==================== -->
<style>
#no-best-players-box {
padding: 20px;
background: #ffffff;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.08);
border-radius: 12px;
}
#seo-featured-betting-site-box {
position: absolute;
z-index: -100;
top: -9999px;
left: -9999px;
}
#featured-list-container {
display: grid;
Expand Down
Loading

0 comments on commit 31d839d

Please sign in to comment.