Good eye! The space in "No. 12" would traditionally get a thin space [0] in professionally typeset documents, which is smaller than the standard space used for inter-word and inter-sentence spacing.
The solution here is to fix the sample text itself to use U+202F (NARROW NO-BREAK SPACE,  ). As opposed to the standard width no-break space it currently has for "No. 12" and "Fig. 7".
Not quite. A "thin space" is thinner than an ordinary interword space, which in turn is thinner (or at least less stretchy) than an intersentence space. The space in "No. 12" or "Fig. 7" or "Mr. Jones" or "cf. page 5" is by definition an interword space! The problem is that HTML renderers tend to prefer to set it as an intersentence space instead, because they think "." always indicates the end of a sentence. Using can help; that's like "~" in TeX. TeX also supports a breaking-but-never-intersentence-sized space via "\ " (backslash space), which is what you'd probably want to use in "cf.\ page~5." AFAIK, HTML/Unicode have no equivalent of that.
The "standard" method would be to double space after the end of a sentence. This is how "filling" paragraphs works in org-mode to avoid breaking a line in the middle of an abbreviation.
The solution here is to fix the sample text itself to use U+202F (NARROW NO-BREAK SPACE,  ). As opposed to the standard width no-break space it currently has for "No. 12" and "Fig. 7".
0: https://en.wikipedia.org/wiki/Thin_space