What are you doing, Kendrick?

The other day, for no reason in particular, I found myself on Kendrick Lamar’s site: https://oklama.com/nuthoughts.

I had the inspector open, because why wouldn’t I have the inspector open, and I noticed something odd in the markup:

<div>
  <p>V fcraq zbfg bs zl qnlf jvgu syrrgvat gubhtugf. Jevgvat. Yvfgravat. Naq pbyyrpgvat byq Ornpu pehvfref.
     Gur zbeavat evqrf xrrc zr ba n uvyy bs&nbsp;fvyrapr.</p>
  <p>V tb zbaguf jvgubhg n cubar.</p>
  <p>Ybir, ybff, naq tevrs unir qvfgheorq zl pbzsbeg mbar, ohg gur tyvzzref bs Tbq fcrnx guebhtu zl zhfvp naq&nbsp;snzvyl.</p>
  <p>Juvyr gur jbeyq nebhaq zr ribyirf, V ersyrpg ba jung znggref gur zbfg. Gur yvsr va juvpu zl jbeqf jvyy ynaq&nbsp;arkg.</p>
  <p>Nf V cebqhpr zl svany GQR nyohz, V srry wbl gb unir orra n cneg bs fhpu n phygheny vzcevag nsgre 17 lrnef.
     Gur Fgehttyrf. Gur Fhpprff. Naq zbfg vzcbegnagyl, gur Oebgureubbq.
     Znl gur Zbfg Uvtu pbagvahr gb hfr Gbc Qnjt nf n irffry sbe pnaqvq perngbef.
     Nf V pbagvahr gb chefhr zl yvsr’f&nbsp;pnyyvat.</p>
  <p>Gurer’f ornhgl va pbzcyrgvba. Naq nyjnlf snvgu va gur&nbsp;haxabja.</p>
  <p>Gunax lbh sbe xrrcvat zr va lbhe gubhtugf. V’ir cenlrq sbe lbh&nbsp;nyy.</p>
  <p>Frr lbh fbba rabhtu.</p>
  <p>-bxynzn</p>
</div>

(I didn’t want to get sued by TDE, so I REDACTED the original text here. You should go read the post on his website.)

The &nbsp;s! They only show up in the Chrome inspector. We’ll get back to these in a second.

The site is built with Next.js. It’s a framework that adds some tooling around the React library to make it easier to develop and deploy. The frame work around my local library is pretty cool too.

Anyway, as far as I can tell, Next.js starts by hydrating the document, which means it needs to build a virtual representation of the DOM tree1:

(0, s.jsxs)("div", {
  children: [
    (0, s.jsx)("p", { children: "V fcraq zbfg bs zl qnlf jvgu syrrgvat gubhtugf. Jevgvat. Yvfgravat. Naq pbyyrpgvat byq Ornpu pehvfref. Gur zbeavat evqrf xrrc zr ba n uvyy bs\xa0fvyrapr." }),
    (0, s.jsx)("p", { children: "V tb zbaguf jvgubhg n cubar." }),
    (0, s.jsx)("p", { children: "Ybir, ybff, naq tevrs unir qvfgheorq zl pbzsbeg mbar, ohg gur tyvzzref bs Tbq fcrnx guebhtu zl zhfvp naq\xa0snzvyl." }),
    (0, s.jsx)("p", { children: "Juvyr gur jbeyq nebhaq zr ribyirf, V ersyrpg ba jung znggref gur zbfg. Gur yvsr va juvpu zl jbeqf jvyy ynaq\xa0arkg." }),
    (0, s.jsx)("p", { children: "Nf V cebqhpr zl svany GQR nyohz, V srry wbl gb unir orra n cneg bs fhpu n phygheny vzcevag nsgre 17 lrnef. Gur Fgehttyrf. Gur Fhpprff. Naq zbfg vzcbegnagyl, gur Oebgureubbq. Znl gur Zbfg Uvtu pbagvahr gb hfr Gbc Qnjt nf n irffry sbe pnaqvq perngbef. Nf V pbagvahr gb chefhr zl yvsr\u2019f\xa0pnyyvat." }),
    (0, s.jsx)("p", { children: "Gurer\u2019f ornhgl va pbzcyrgvba. Naq nyjnlf snvgu va gur\xa0haxabja." }),
    (0, s.jsx)("p", { children: "Gunax lbh sbe xrrcvat zr va lbhe gubhtugf. V\u2019ir cenlrq sbe lbh\xa0nyy." }),
    (0, s.jsx)("p", { children: "Frr lbh fbba rabhtu." }),
    (0, s.jsx)("p", { children: "-bxynzn" }),
  ]
}

Note the \xa0 and \u2019 code points. They map to &nbsp; and ’ respectively.

So the spaces are definitely coming from the source, and this isn’t actually a bug in the browser. Good to know.

Okay, but why are the nbsps there?

Well, the obvious answer is that the developer used them exactly as they’re meant to be used: to avoid pushing individual words onto separate lines. For aesthetics or something.

The less obvious (and more correct) answer is that there’s a hidden message here. I just don’t know what it is yet.I really dont.

The six words that are preceded by the nbsps are: silence, family, next, calling, unknown, and all. Here are their permutations. None of them make much sense to me, but let me know if you find something.

  1. If you don’t know what (0, s.jsx)(...) is doing, you should read about the comma operator. It’s wild. ↩︎