1

On my websites I tend to use site links as opposed to relative links as shown below:

I use:

<link rel="stylesheet" type="text/css" href="http://www.example.com/_css/_all/stylesheet-global-styles.css" />

Alternative (relative):

<link rel="stylesheet" type="text/css" href="/_css/_all/stylesheet-global-styles.css" />

The reason I use site links is because I use a lot of vanity URL's such as:

example.com/test => example.com/test.php

example.com/test/1 => example.com/test.php?id=1

As a result of the multiple '/' within the second example, my pages think that they are in a subdirectory of the website so therefore 'relative' links do not work unless I put in a '../'. I cannot do this because that would mean directories based upon whether or not a query string exists and how many '/' there are. Consequently I am forced to use site links to include my required content.

I am aware that each request must therefore execute a DNS lookup and this will slow it down, but my question is, how much slower is it if I am linking, lets say, 5 stylesheets and scripts?

Ben Carey
  • 16,540
  • 19
  • 87
  • 169

5 Answers5

8

Are relative links much faster than site links?

no, because they're one and the same. Relative links are a merely a webmaster convenience provided by the browser. They, too, are resolved into absolute links in the end: Every request that is sent to the server always contains the full hostname and path.

DNS lookups are cached, so there won't be multiple lookups if the system is configured properly.

Pekka
  • 442,112
  • 142
  • 972
  • 1,088
  • Though I'd say relative links add a little over-head on the browser side just to transform them into site links, no matter how negligible that overhead might be :-) – JWL Feb 17 '12 at 08:26
  • I figured that after reading the above answer. Thanks guys, very helpful! :-) – Ben Carey Feb 17 '12 at 08:27
  • @mcnemesis - possibly, but at least in some cases, the checking of cross-origin policy rules, required for absolute links, but skipable for relative links may be a greater overhead. Either way, the difference is negligible. – Alohci Feb 17 '12 at 08:37
2

It doesn’t really make a difference. Behind the scenes, browsers convert the links into full URLs anyway. The DNS lookup cost is minimal since DNS lookups are cached.

IMHO, relative links are easier to maintain. You should just use whichever technique you think is the most convenient. Performance is not an issue here.

If you want to improve performance, you’d be much better off combining your stylesheets into a single file and minifying it. The same goes for script files.

Mathias Bynens
  • 144,855
  • 52
  • 216
  • 248
  • I personally dont believe that relative links is easier to maintain. Especially when using URL rewriting. – Martin Dandanell Feb 17 '12 at 08:22
  • Forgot to mention earlier, do not minify your CSS if you are concerned about SEO. Google respects well commented CSS files! Therefore I only minify my JS – Ben Carey Feb 17 '12 at 13:41
  • @BenCarey I doubt that’s true. Where did you get this? Google cares about site speed and doesn’t care about CSS comments. – Mathias Bynens Feb 17 '12 at 15:52
  • @MathiasBynens I would agree with you and I want to but my source of that info was a professional SEO consultant. Google does of course care about site speed, but there are many other factors (as you will know) that are more important than site speed and Google will register this. The speed you will save by minifying most CSS files is minimal and I would say it is therefore not worth the risk. Obviously if your site is already highly ranked then you do not need to worry and you can focus on optimizing the site for speed, but for smaller sites I would not minify just in case – Ben Carey Feb 17 '12 at 16:24
  • 1
    I work for Google on the Chrome team. While this certainly isn't an official Google SEO position, let's just say Mathias is totally right about this. Google wants your CSS and JS as minified and concatenated as possible because *fast sites are good sites*. – Paul Irish Feb 18 '12 at 00:10
2

What happens when you click a link in your browser?
The browser starts a HTTP request.

How does it look like?
If you are on http://www.example.com/path1/page1.html

and click on links
../path2/page2.html or
/path2/page2.html or
http://www.example.com/path2/page2.html
the request is always the same

GET /path2/page2.html HTTP/1.1  
host: www.example.com

So no difference with the request

So feel free to organize your links as you like.

yunzen
  • 32,854
  • 11
  • 73
  • 106
0

When using an / before the reference your path becomes absolute beginning from the root of your website - in opposite to using ../ which is like you said relative.

Martin Dandanell
  • 831
  • 1
  • 7
  • 20
-2

Why don't you do this

//yourapp.com/assets/css/style.css
//yourapp.com/assets/js/jq.js

//yourapp.com/cp/register
//yourapp.com/cp/update_account

// literally means if SSL or if non-SSL, it will always resolve. No difference in speed either.

reference on double slash domain //site.com and for ssl non ssl

Community
  • 1
  • 1
TheBlackBenzKid
  • 26,324
  • 41
  • 139
  • 209