IF CONTAINS vs == over a large link list performance?

cckk
New Member
8 0 0

Does it matter if I use contains vs == to match a URL in the link list? Does it have a performance hit?

 

I use if statement to show icons next to any of my social media links. Like so:

{% if child_link.url == "https://instagram.com/username"  %}
Instagram
{% elsif child_link.url == "https://www.facebook.com/username" %}
Facebook
{% elsif child_link.url == "https://www.youtube.com/user/username/videos" %}
YouTube
{% elsif child_link.url == "https://twitter.com/username" %}
Twitter
{% else %}
{% endif %}  

 

 

 

Can I use contains instead so I don't have to specify the exact URL?

Will there be a big performance hit using this in the footer on every page of the site?

 

{% if child_link.url contains "instagram" %}
Instagram
{% elsif child_link.url contains "facebook" %}
Facebook
{% elsif child_link.url contains "youtube" %}
YouTube
{% elsif child_link.url contains "twitter" %}
Twitter
{% else %}
{% endif %}

 

0 Likes
JoesIdeas
Shopify Expert
1354 119 357

My guess is the difference will be insignificant, but you can test this by setting up a timer to see how long it takes to load each.

For example you could do something like this:

<script>
  const startTime = new Date().getTime();
  console.log("Start time: " + startTime);
</script>

<!-- Put your liquid code between the time loggers -->

<script>
  const endTime = new Date().getTime();
  console.log("End time: " + startTime);
  console.log("Elapsed time: " + (endTime - startTime));
</script>

 

That will log 2 numbers in your console, just subtract the 1st from the 2nd and it will give you the time elapsed in milliseconds (also calculated in that example).

Founder of Speed Boostr (Shopify optimization experts, theme customization, custom app development).
Creator of Shopify Analyzer (first performance analysis tool for Shopify sites, free for the Shopify community).
Creator of Order Automator (auto tag orders and customers + auto fulfillment + more automations).
More apps: Theme Scientist (A/B testing), Tip Jar (add a tip button), File Optimizer (optimize CSS, JS, Liquid).
0 Likes