12

I was browsing thought GitHub today and noticed that the individual repository navigation doesn't use hash-bangs in the URL /#! or /# and the back button still works. How do you think they are accomplishing this? How does this affect search engine crawling from Googlebot? I know it looks for # in the url.

I'm really quite curious as I know using /# is quite debatable.

Here's an example: https://github.com/mirah/pindah

Thanks!

Nate
  • 121
  • 1
  • 3
  • possible duplicate of [How to do awesome refreshless page changes like GitHub](http://stackoverflow.com/questions/4664166/how-to-do-awesome-refreshless-page-changes-like-github) – Bergi Jul 29 '13 at 13:47

2 Answers2

17

They blogged about it a while back:

https://github.com/blog/760-the-tree-slider

RJ Regenold
  • 1,748
  • 13
  • 17
11

The effect is implemented history.pushState() function and handlers on the popstate event — both a part of the HTML5 DOM interface in some browsers.

Clicking the link uses pushState() to update the location and load new data into the page without reloading the whole page. Handling popstate makes the back button work correctly.

The GutHub blog calls their particular usage the “Tree Slider” (it loads the content for tree members and visually slides it into place). The effect and its implementation was described on the GitHub blog.

Chris Johnsen
  • 214,407
  • 26
  • 209
  • 186