javascript - Could someone please explain the Google homepage JS? - Stack Overflow

admin管理员组

文章数量:1339459

Following are some of the "weird" snippets that are on the Google homepage..(google/ncr that is)

({"s":{"#":[{"h":"ad","g":["Google","E4hE342CDKOgAFYm15AW","1",0,0,1]},{"h":"p","g":["ghead","

,0]},{"h":"p","g":["footer","

",0]},{"h":"p","g":["body","

",0]},{"h":"p","g":["xjsi","

And then there's this:

<script>if(google.y)google.y.first=[];if(google.y)google.y.first=[];if(!google.xjs){google.dstr=[];google.rein=[];window.setTimeout(function(){var a=document.createElement(\"script\");a.src=\"/extern_js/f/CgJlbiswCjhMQAgsKzAOOAosKzAWOBQsKzAXOAQsKzAYOAQsKzAZOA0sKzAdOBssKzAhOCtAASwrMCU4yYgBLCswJjgILCswJzgCLCswKjgCLCswKzgJLCswPDgCLCswQDgFLCswRDgALCswRTgALA/JqRMsHQD1vo.js\";(document.getElementById(\"xjsd\")||document.body).appendChild(a);if(google.timers&&google.timers.load.t)google.timers.load.t.xjsls=(new Date).getTime();},0);\u000agoogle.xjs=1};google.y.first.push(function(){google.ac.m=1;google.ac.b=true;google.ac.i(document.f,document.f.q,'','','OvaKevzR5YKoeJu2mSddyQ');(function(){\u000avar a=window.google.f={};a.f=1;a.s=1;a.a=(new Date).getTime();google.rein.push(function(){a.f=1;a.s=1;a.a=(new Date).getTime()});google.dstr.push(function(){google.fade=null});function m(b,g,e,f){var d,c=[],i=[];for(var h=0,k;k=b[h++];){var l=document.getElementById(k);if(l)c.push(l)}for(var h=0,j;j=g[h++];){var o=n(j[0],j[1]);while(d=o.pop())c.push(d)}while(d=c.pop())i.push([d,\"opacity\",e,f,0,\"\"]);return i}function n(b,\u000ag){var e=[];for(var f=document.getElementsByTagName(b),d=0,c=f[d];c=f[d++];)if(c.className==g)e.push(c);return e}google.fade=function(b){b=b||window.event;var g=1;if(b&&b.type==\"mousemove\"){var e=b.clientX,f=b.clientY;g=a.x||a.y?Math.abs(a.x-e)+Math.abs(a.y-f):0;a.x=e;a.y=f}var d=(new Date).getTime(),c=d-a.a;if(google.fx&&g&&c>602)if(a.f){a.f=0;var i=[\"fctr\",\"ghead\",\u000a\"pmocntr\",\"sbl\",\"tba\",\"tbe\"],h=[[\"span\",\"fade\"],[\"div\",\"gbh\"]];google.fx.animate(602,m(i,h,0,1))}};\u000a})();\u000a});if(google.j&&google.j.en&&google.j.xi){window.setTimeout(google.j.xi,0);google.fade=null;}</script>",0]},{"h":"zz","g":[0,1]}]},"c":{"1":{"cc":[],"co":["ghead","body","footer","xjsi"],"pc":[],"nb":0,"css":"td{line-height:.8em;}.gac_m td{line-height:17px;}form{margin-bottom:20px;}body,td,a,p,.h{font-family:arial,sans-serif}.h{color:#36c;font-size:20px}.q{color:#00c}.ts td{padding:0}.ts{border-collapse:collapse}em{font-weight:bold;font-style:normal}.lst{font:17px arial,sans-serif;margin-bottom:.2em;vertical-align:bottom;}input{font-family:inherit}.lsb,.gac_sb{font-size:15px;height:1.85em!important;margin:.2em;}#fctr,#ghead,#pmocntr,#sbl,#tba,#tbe,.fade{opacity:0;}#fctr,#ghead,#pmocntr,#sbl,#tba,#tbe,.fade{background:#fff;}#gbar{float:left;height:22px}.gbh,.gbd{border-top:1px solid #c9d7f1;font-size:1px}.gbh{height:0;position:absolute;top:24px;width:100%}#gbs,.gbm{background:#fff;left:0;position:absolute;text-align:left;visibility:hidden;z-index:1000}.gbm{border:1px solid;border-color:#c9d7f1 #36c #36c #a2bae7;z-index:1001}#guser{padding-bottom:7px !important;text-align:right}#gbar,#guser{font-size:13px;padding-top:1px !important}.gb1,.gb3,.gb3i,.gb3f{zoom:1;margin-right:.5em}.gb2,.gb2i,.gb2f{display:block;padding:.2em .5em}a.gb1,a.gb2,a.gb3,a.gb4{color:#00c !important}.gb2,.gb2i,.gb2f,.gb3,.gb3i,.gb3f{text-decoration:none}a.gb2:hover{background:#36c;color:#fff !important}","main":"<div id=ghead></div><span id=body></span><span id=footer></span><span id=xjsi></span>"}}})

Here's a very interesting one:

onload=\"window.lol&&lol()\"

Why do they escape everything?

This seems pretty self explainatory:

onblur=\"google&&google.fade&&google.fade()\" 

Appreciate it if you can explain any of the above. Thanks!

Following are some of the "weird" snippets that are on the Google homepage..(google./ncr that is)

({"s":{"#":[{"h":"ad","g":["Google","E4hE342CDKOgAFYm15AW","1",0,0,1]},{"h":"p","g":["ghead","

,0]},{"h":"p","g":["footer","

",0]},{"h":"p","g":["body","

",0]},{"h":"p","g":["xjsi","

And then there's this:

<script>if(google.y)google.y.first=[];if(google.y)google.y.first=[];if(!google.xjs){google.dstr=[];google.rein=[];window.setTimeout(function(){var a=document.createElement(\"script\");a.src=\"/extern_js/f/CgJlbiswCjhMQAgsKzAOOAosKzAWOBQsKzAXOAQsKzAYOAQsKzAZOA0sKzAdOBssKzAhOCtAASwrMCU4yYgBLCswJjgILCswJzgCLCswKjgCLCswKzgJLCswPDgCLCswQDgFLCswRDgALCswRTgALA/JqRMsHQD1vo.js\";(document.getElementById(\"xjsd\")||document.body).appendChild(a);if(google.timers&&google.timers.load.t)google.timers.load.t.xjsls=(new Date).getTime();},0);\u000agoogle.xjs=1};google.y.first.push(function(){google.ac.m=1;google.ac.b=true;google.ac.i(document.f,document.f.q,'','','OvaKevzR5YKoeJu2mSddyQ');(function(){\u000avar a=window.google.f={};a.f=1;a.s=1;a.a=(new Date).getTime();google.rein.push(function(){a.f=1;a.s=1;a.a=(new Date).getTime()});google.dstr.push(function(){google.fade=null});function m(b,g,e,f){var d,c=[],i=[];for(var h=0,k;k=b[h++];){var l=document.getElementById(k);if(l)c.push(l)}for(var h=0,j;j=g[h++];){var o=n(j[0],j[1]);while(d=o.pop())c.push(d)}while(d=c.pop())i.push([d,\"opacity\",e,f,0,\"\"]);return i}function n(b,\u000ag){var e=[];for(var f=document.getElementsByTagName(b),d=0,c=f[d];c=f[d++];)if(c.className==g)e.push(c);return e}google.fade=function(b){b=b||window.event;var g=1;if(b&&b.type==\"mousemove\"){var e=b.clientX,f=b.clientY;g=a.x||a.y?Math.abs(a.x-e)+Math.abs(a.y-f):0;a.x=e;a.y=f}var d=(new Date).getTime(),c=d-a.a;if(google.fx&&g&&c>602)if(a.f){a.f=0;var i=[\"fctr\",\"ghead\",\u000a\"pmocntr\",\"sbl\",\"tba\",\"tbe\"],h=[[\"span\",\"fade\"],[\"div\",\"gbh\"]];google.fx.animate(602,m(i,h,0,1))}};\u000a})();\u000a});if(google.j&&google.j.en&&google.j.xi){window.setTimeout(google.j.xi,0);google.fade=null;}</script>",0]},{"h":"zz","g":[0,1]}]},"c":{"1":{"cc":[],"co":["ghead","body","footer","xjsi"],"pc":[],"nb":0,"css":"td{line-height:.8em;}.gac_m td{line-height:17px;}form{margin-bottom:20px;}body,td,a,p,.h{font-family:arial,sans-serif}.h{color:#36c;font-size:20px}.q{color:#00c}.ts td{padding:0}.ts{border-collapse:collapse}em{font-weight:bold;font-style:normal}.lst{font:17px arial,sans-serif;margin-bottom:.2em;vertical-align:bottom;}input{font-family:inherit}.lsb,.gac_sb{font-size:15px;height:1.85em!important;margin:.2em;}#fctr,#ghead,#pmocntr,#sbl,#tba,#tbe,.fade{opacity:0;}#fctr,#ghead,#pmocntr,#sbl,#tba,#tbe,.fade{background:#fff;}#gbar{float:left;height:22px}.gbh,.gbd{border-top:1px solid #c9d7f1;font-size:1px}.gbh{height:0;position:absolute;top:24px;width:100%}#gbs,.gbm{background:#fff;left:0;position:absolute;text-align:left;visibility:hidden;z-index:1000}.gbm{border:1px solid;border-color:#c9d7f1 #36c #36c #a2bae7;z-index:1001}#guser{padding-bottom:7px !important;text-align:right}#gbar,#guser{font-size:13px;padding-top:1px !important}.gb1,.gb3,.gb3i,.gb3f{zoom:1;margin-right:.5em}.gb2,.gb2i,.gb2f{display:block;padding:.2em .5em}a.gb1,a.gb2,a.gb3,a.gb4{color:#00c !important}.gb2,.gb2i,.gb2f,.gb3,.gb3i,.gb3f{text-decoration:none}a.gb2:hover{background:#36c;color:#fff !important}","main":"<div id=ghead></div><span id=body></span><span id=footer></span><span id=xjsi></span>"}}})

Here's a very interesting one:

onload=\"window.lol&&lol()\"

Why do they escape everything?

This seems pretty self explainatory:

onblur=\"google&&google.fade&&google.fade()\" 

Appreciate it if you can explain any of the above. Thanks!

• javascript

Share Improve this question Follow asked Jan 6, 2010 at 13:02 MrSplashyPantsMrSplashyPants 29311 gold badge55 silver badges1414 bronze badges 1

• 2 Why the downvote? These look like legitimate and somewhat interesting questions to me! – Carl Smotricz Commented Jan 6, 2010 at 13:09

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 11

The early examples are basically just minification (removal of whitespace, use of short variable names, etc), to reduce the size of the page.

As for:

onload=\"window.lol&&lol()\"

The page actually has:

onload="window.lol&&lol()"

It has & because & must be represented that way in HTML (except in CDATA blocks, which attribute values never are). So it means:

window.lol && lol();

which means:

If the window object has a property called lol, execute that property as a function.

The use of the explicit window object in the first instance is to stop it erroring if the property is not defined, and the lack of using it in the second instance is to reduce the size of the page (since window is implied when calling a function that isn't explicitly a method of another object).

I can't give a full answer, but the endless escaping is probably to cater for older browsers with improper charset support.

The reason, of course, that is so condensed is to make it load really fast.

edit: I would not call the code obscurified as much as it is extremely highly optimized.

Probably not the tool used for google's home page, but google's closure piler could produce this kind of gibberish.

本文标签： javascriptCould someone please explain the Google homepage JSStack Overflow