?

Log in

No account? Create an account
Friends page in JavaScript - brad's life [entries|archive|friends|userinfo]
Brad Fitzpatrick

[ website | bradfitz.com ]
[ userinfo | livejournal userinfo ]
[ archive | journal archive ]

Friends page in JavaScript [Sep. 12th, 2005|10:49 pm]
Brad Fitzpatrick
[Tags|, , ]

In my copious free time, I've "ported" the LiveJournal friend's page algorithm from Perl (running on the server), to JavaScript (running in the browser).

So instead of making one huge friends page request and getting back a rendered document with 95% duplicate stuff that your client has already downloaded 15 seconds ago when you habitually hammered refresh, your client instead makes dozens of tiny requests, easily cachable on both the client and server, all the way up to the BIG-IP where I can later just instruct it to 304 any If-Modified-Since request on certain immutable URLs. (ala /userpic/ requests)

Plus it can have a background thread polling the last updated times of your friends page, deciding when to refresh itself, just doing the minimum work necessary to update fully. And even if you hit shift-reload to cache-bust, that only cache-busts the pages necessary to onLoad() the document. After that, javascript takes over so the browser goes back to caching. (Had to do some an old-school work-around to make Firefox cache, but IE behaves.... I wish XmlHttpRequest's caching behavior was specified and consistent.)

Anyway, works in IE/Safari/Firefox. Been reading my friend's page in it the past couple days. Pretty addictive.

I'll post a URL when it's beautified a bit and it's not lacking 75% of its future feature set.
LinkReply

Comments:
(Deleted comment)
[User Picture]From: brad
2005-09-13 05:57 am (UTC)
?mode=live is currently live on the site, but I doubt it works. I removed it from cvs the other day, knowing this was on its way, and to make the code cleaner.
(Reply) (Parent) (Thread)
[User Picture]From: midendian
2005-09-13 06:00 am (UTC)
Neat.
(Reply) (Thread)
[User Picture]From: bigjimsjazz
2005-09-13 06:04 am (UTC)
Sounds cool.
(Reply) (Thread)
(Deleted comment)
[User Picture]From: brad
2005-09-13 07:05 am (UTC)
It's not even released yet. So relax.
(Reply) (Parent) (Thread) (Expand)
[User Picture]From: avva
2005-09-13 06:06 am (UTC)
Wow.

I've been waiting for you to do this eventually, with your enthusiasm for
XmlHttpRequest... but, Wow.
(Reply) (Thread)
[User Picture]From: mcfnord
2005-09-13 06:11 am (UTC)
you're a clever cat.
(Reply) (Thread)
[User Picture]From: matthew
2005-09-13 06:25 am (UTC)
Rock on. Anything that reduces load makes me a happy admin :)

Why aren't we 304'ing If-Modified-Since requests on those immutable URLs already? It would save some requests from googlebot.
(Reply) (Thread)
From: evan
2005-09-13 06:50 am (UTC)
for the current entry pages on lj, they can change -- you can edit the post, or get another comment, etc. i think brad constructs unique urls each time the page changes so a given url is always static.
(Reply) (Parent) (Thread)
[User Picture]From: mart
2005-09-13 07:01 am (UTC)

How are you doing the page construction? Is it client-side S2, or have you come up with something better?

(Reply) (Thread)
[User Picture]From: brad
2005-09-13 07:04 am (UTC)
It won't be user-customizable. Likely/maybe CSS for font/colors/etc, but not S2, and not S1. There might not even be user CSS, just a selection of a few themes users can select. I want to control the DOM and classnames and ids so I can do things like commentmanage.js easily, without each and every fucking style having to advertise its DOM structure, and none working perfectly.

(Reply) (Parent) (Thread) (Expand)
(Deleted comment)
[User Picture]From: taral
2005-09-13 07:09 am (UTC)
So how's that ?start= for friends pages coming, hm? You know, the one that was in the works YEARS AGO? :P
(Reply) (Thread)
[User Picture]From: brad
2005-09-13 07:16 am (UTC)
Not gonna happen. Doesn't scale. The friends page algorithm is finishes in 's' steps, where 's' is the number of items to view. The ?start= would require way more indexes (beyond being worth it) and/or an algorithm that runs in 'f' steps, where 'f' is your number of friend, which also won't happen.

However, bookmarkable URLs are totally doable, encoding in them the content of the page, and where you're at in time. Then the previous/back links can be optionally shown, if the time you're viewing the page is within the 2 week scrollback period.

As for solving the "I was away on vacation for 3 weeks" problem where you want to catch up going forward in time, that's more of the always-talked-about-but-never-done ESN system, which is actually now on our roadmap after Scrapbook improvements, but since I'm not so involved with Scrapbook, I might work on ESN a bit earlier.

In fact --- much of my work on this javascript friends page is to make ESN integration a lot easier in the future.
(Reply) (Parent) (Thread) (Expand)
[User Picture]From: alohawolf
2005-09-13 07:16 am (UTC)
presumably when you put this into place, it would auto detect that your browser could support, and do it the old way, if the browser didn't support Javascript fully?
(Reply) (Thread)
[User Picture]From: brad
2005-09-13 07:18 am (UTC)
Yeah. Or more likely tell you to go use the friends page, since this system is at a different URL.

There will be a new option to let you disable your friends page... either completely, or just the link to it from your journal.

So for a couple years (or likely forever), the friends page will still exist for those that don't want to use the fancy version.
(Reply) (Parent) (Thread) (Expand)
[User Picture]From: taral
2005-09-13 07:53 am (UTC)
Wait. This means you have machine-readable interfaces for (a) retrieving entries and (b) retrieving entry links for the friends list. Are these going to be published interfaces?
(Reply) (Thread)
[User Picture]From: andrewducker
2005-09-13 01:18 pm (UTC)
That was my first thought - this could all become client-based! Oh, to have a nice news-reader type interface for LJ.
(Reply) (Parent) (Thread)
[User Picture]From: d4b
2005-09-13 01:26 pm (UTC)
Such a shame, all of those unused CPU cycles out there... I'm speaking of those who are repeatedly hitting their refresh button in the first place.

Sure wish I could show them ads while they were waiting. :-)
(Reply) (Thread)
[User Picture]From: brad
2005-09-13 04:05 pm (UTC)
Go away. :P
(Reply) (Parent) (Thread)
[User Picture]From: dakus
2005-09-13 04:12 pm (UTC)
Can we see it yet?

I'm imagining mouseover comment# links having a popup list of usernames that have commented and other cool stuff...
(Reply) (Thread)
[User Picture]From: lisa
2005-09-13 04:27 pm (UTC)
bossome.
(Reply) (Thread)
[User Picture]From: brad
2005-09-13 09:37 pm (UTC)
Is that when the boss does something awesome?
(Reply) (Parent) (Thread)
[User Picture]From: torgo_x
2005-09-16 10:59 am (UTC)

Higher-Order JavaScript

Speaking of JavaScript, you might like this stuff I've been writing lately.
(Reply) (Thread)