1
00:00:06,280 --> 00:00:09,300
Okay, good morning everyone.

2
00:00:09,300 --> 00:00:12,540
I'm going to talk about the
Linux Font Rendering stack,

3
00:00:12,860 --> 00:00:18,680
and that is what I learned the last
four and a half years.

4
00:00:18,680 --> 00:00:22,080
I worked at the
city administration of Munich.

5
00:00:22,920 --> 00:00:28,400
For introduction to font rendering,

6
00:00:30,320 --> 00:00:34,780
I can say writing is
the most used interface,

7
00:00:34,780 --> 00:00:39,080
or probably the most used interface
between humans and the machines.

8
00:00:39,080 --> 00:00:45,700
So all of you probably use it everyday
on your computer.

9
00:00:48,500 --> 00:00:52,780
Screen text is replacing text on paper
more and more

10
00:00:52,780 --> 00:00:56,820
and this is still an ongoing process.

11
00:01:00,620 --> 00:01:09,160
The way from a string in a computer to
display text is surprisingly complex,

12
00:01:09,160 --> 00:01:14,640
And writing in itself is quite profound.

13
00:01:14,640 --> 00:01:24,960
For example, it's influenced by history
so probably all, or at least most,

14
00:01:24,960 --> 00:01:30,680
writing systems are derived from some
pictograph writing systems.

15
00:01:31,140 --> 00:01:34,440
This is also true for Roman letters.

16
00:01:36,080 --> 00:01:43,980
And also the Roman letters themselves,
they changed a lot since 2000 years ago.

17
00:01:43,980 --> 00:01:51,120
In the Roman Empire they used some
different letters than we use now.

18
00:01:51,120 --> 00:01:56,980
So the goal of this talk is to raise
awareness of font rendering in computing,

19
00:01:56,980 --> 00:02:00,740
with the focus on the Linux desktop.

20
00:02:04,740 --> 00:02:11,680
Now to the history,
and then I talk about typography.

21
00:02:13,780 --> 00:02:17,400
Text display in early computing.

22
00:02:17,400 --> 00:02:24,760
In early computing it was just
a way to display results.

23
00:02:26,380 --> 00:02:29,900
Before that there were
only flashing lights

24
00:02:29,900 --> 00:02:34,420
where you can read the results
and...

25
00:02:35,660 --> 00:02:39,840
[audience member] ??... BT100
?? raise your hand

26
00:02:43,300 --> 00:02:47,660
[Max] And the output device receives
a page or a character stream,

27
00:02:47,660 --> 00:02:52,000
and then the presentation is the job
of the output device.

28
00:02:52,000 --> 00:02:58,000
So for example, a typewriter
or a printer or a terminal.

29
00:02:58,000 --> 00:03:05,780
And this is a BT100
you can see on the right side.

30
00:03:05,780 --> 00:03:08,340
So this is a real terminal.

31
00:03:13,260 --> 00:03:19,420
But going on in history
there's the home computer era.

32
00:03:21,860 --> 00:03:25,730
In the home computer era you have
fixed character sets

33
00:03:25,730 --> 00:03:31,840
and most of the time due to system
limitations, memory limitations,

34
00:03:31,840 --> 00:03:35,700
you have graphics mode and text mode.

35
00:03:38,100 --> 00:03:46,840
In the graphics mode you can basically
set the pixels more or less as you want,

36
00:03:46,840 --> 00:03:53,000
and in the text mode you can use fonts.

37
00:03:55,620 --> 00:03:59,540
The screen configuration at that time
is more or less defined

38
00:03:59,540 --> 00:04:01,540
by the state of technology.

39
00:04:01,540 --> 00:04:07,740
So every screen at that time has more or
less the same resolution,

40
00:04:07,740 --> 00:04:15,680
and that's something that the engineers
of that time relied on,

41
00:04:15,680 --> 00:04:18,200
and also software engineers relied on.

42
00:04:19,660 --> 00:04:24,980
The text rendering was just
using bitmap fonts.

43
00:04:24,980 --> 00:04:37,120
That means you have a fixed size character
and you just define it pixelwise

44
00:04:38,780 --> 00:04:45,040
so it's some kind of hand-crafted
characters.

45
00:04:45,040 --> 00:04:51,320
You have a given raster and then
you really display

46
00:04:51,320 --> 00:04:54,340
these hard-defined characters.

47
00:04:59,520 --> 00:05:06,740
So then I need to introduce a few
typography terms.

48
00:05:12,380 --> 00:05:16,260
First, there's glyph or a character.

49
00:05:21,320 --> 00:05:25,420
That's...well you can say a symbol.

50
00:05:26,920 --> 00:05:31,700
So I think most people can understand what
that means.

51
00:05:31,700 --> 00:05:36,240
Then a font, this is a set of glyphs.

52
00:05:38,040 --> 00:05:45,320
And then we have a collection of fonts,
that is called typeface or font family.

53
00:05:45,320 --> 00:05:53,020
Those are closely related fonts with
the same visual appearance,

54
00:05:53,020 --> 00:05:59,920
And they differ only in slopes or widths
or weights for example.

55
00:06:03,880 --> 00:06:12,480
Usually with typesetting, with moving
letters in the printing press,

56
00:06:12,480 --> 00:06:25,140
you really had, for weight for example,
different pieces/letters/hardware.

57
00:06:27,740 --> 00:06:31,460
And then the point size,
or typographic unit.

58
00:06:32,560 --> 00:06:41,770
This is a measure of the size, and
derives directly from the printing press

59
00:06:41,770 --> 00:06:44,560
with moving letters.

60
00:06:48,400 --> 00:06:56,500
There are different definitions, and what
we probably all use as point size is the

61
00:06:56,500 --> 00:07:03,760
DTP point – desktop publishing point,

62
00:07:03,760 --> 00:07:18,520
where one point is defined as 1/72 inch,
which is 0.3527 period millimeters.

63
00:07:18,520 --> 00:07:25,980
It is interesting to note that this has
nothing to do with pixels.

64
00:07:28,600 --> 00:07:30,980
[audience] (unintelligible question)

65
00:07:30,980 --> 00:07:34,700
[Max] Please use the microphone
if you a question.

66
00:07:35,900 --> 00:07:39,440
[audience] ...3257, what's the bar
over the 7 mean?

67
00:07:39,440 --> 00:07:43,160
[Max] It means that the 7 goes
on and on and on forever.

68
00:07:51,000 --> 00:07:58,500
So this is typography of the
Latin alphabet...terminology.

69
00:07:58,500 --> 00:08:01,740
There's something called kerning.

70
00:08:02,400 --> 00:08:08,380
You can see an example of kerning
on the right side.

71
00:08:08,380 --> 00:08:19,180
So in the printing press you have letters
and they usually have a gap.

72
00:08:21,400 --> 00:08:29,600
To improve the readability, and to
make all the text appear more uniform

73
00:08:31,140 --> 00:08:33,760
the typesetter reduces the gap.

74
00:08:35,659 --> 00:08:39,700
With moving letters they have special
letter pairs...

75
00:08:40,679 --> 00:08:46,180
if you go on with this
there are ligatures,

76
00:08:46,180 --> 00:08:50,620
which are replacement glyphs for close
standing characters.

77
00:08:52,140 --> 00:08:57,300
An example of this is
a double f, fi or fl.

78
00:08:58,300 --> 00:09:05,440
So you can see also in the slides here
that double f is such a ligature.

79
00:09:06,320 --> 00:09:08,600
It's one connected glyph.

80
00:09:10,980 --> 00:09:16,480
And then there's a speciality
if you reverse all of the ?? [static].

81
00:09:18,120 --> 00:09:20,040
The term non-proportional font.

82
00:09:20,040 --> 00:09:27,300
So you have a font where very character,
every glyph, has the same width.

83
00:09:27,300 --> 00:09:30,640
This is also called monospace font.

84
00:09:33,640 --> 00:09:40,820
Sometimes you distinguish half-width
and full width letters.

85
00:09:41,480 --> 00:09:45,740
This is also something you would see
on a typewriter for example.

86
00:09:47,440 --> 00:09:54,020
Early bitmap fonts are usually
monospaced fonts.

87
00:09:56,440 --> 00:10:01,740
Okay, let's go to
the text rendering stack.

88
00:10:06,520 --> 00:10:08,980
Text rendering today.

89
00:10:10,400 --> 00:10:15,090
In all computing nowadays,
typography is introduced.

90
00:10:15,090 --> 00:10:24,500
So won't find many devices on the market
which don't use accurate typography.

91
00:10:28,160 --> 00:10:32,280
Glyphs are now represented as
size-independent outlines.

92
00:10:32,280 --> 00:10:37,520
We can see on the right side there's
a font editor: Font Forge.

93
00:10:37,520 --> 00:10:41,900
This is the way that such fonts
are created.

94
00:10:41,900 --> 00:10:47,160
So you can see here in the picture
the outline of the "S".

95
00:10:49,200 --> 00:10:55,960
It's a size-independent outline and
you can just use that for

96
00:10:55,960 --> 00:10:59,180
every kind of display.

97
00:10:59,180 --> 00:11:04,020
And then you do something that is called
rasterization, or sampling, or rendering

98
00:11:04,020 --> 00:11:08,000
for displaying it at the actual display.

99
00:11:09,660 --> 00:11:13,760
In the past this allowed for new
applications for computers.

100
00:11:13,760 --> 00:11:19,680
First it allowed word processing and
computer-based typesetting.

101
00:11:21,240 --> 00:11:26,320
Before that typesetting was
a very hard job.

102
00:11:26,740 --> 00:11:30,800
It allowed internationalization.

103
00:11:36,600 --> 00:11:41,500
It allows universal graphical interface
which goes

104
00:11:41,500 --> 00:11:45,420
hand-in-hand with internationalization.

105
00:11:46,280 --> 00:11:52,380
Come to think of it, not so long ago it
was not so common that you could

106
00:11:52,380 --> 00:11:58,280
buy devices where you can easily switch
the language to

107
00:11:58,280 --> 00:12:01,680
any language you would like.

108
00:12:01,680 --> 00:12:05,320
This is just a recent development.

109
00:12:06,600 --> 00:12:15,600
So now I will give you an overview of
the formats we see on Linux systems.

110
00:12:15,600 --> 00:12:18,880
First I talk about the bitmap formats.

111
00:12:18,880 --> 00:12:27,120
Today we have bitmap formats in the
PC Screen Font format,

112
00:12:27,120 --> 00:12:28,960
PSF or PSFU.

113
00:12:28,960 --> 00:12:36,180
These are the fonts that are used for the
Linux VT, also known as the console.

114
00:12:36,180 --> 00:12:45,700
Usually you can store in such a font
256 or 512 glyphs.

115
00:12:45,700 --> 00:12:52,540
Some of them contain
a Unicode translation table.

116
00:12:53,800 --> 00:12:59,500
And on the other hand there are
X Window System Bitmap Fonts.

117
00:12:59,500 --> 00:13:02,820
There are three formats:

118
00:13:02,820 --> 00:13:07,060
There's a Sever Normal Format (SNF).

119
00:13:07,060 --> 00:13:11,340
Glyph Bitmap Distribution Format (BDF).

120
00:13:11,340 --> 00:13:13,960
And Portable Compiled Format (PCF).

121
00:13:13,960 --> 00:13:22,680
Nowadays PCF is the only letter that
you can find on a Linux system if so,

122
00:13:22,680 --> 00:13:29,160
and the first two are deprecated.

123
00:13:29,160 --> 00:13:40,220
And also the X Window Bitmap Fonts
themselves are not very common these days.

124
00:13:44,560 --> 00:13:47,380
To the outline font formats.

125
00:13:49,020 --> 00:13:51,960
There are Postscript Formats.

126
00:13:53,920 --> 00:14:05,240
Postscript Formats have different versions
as I would call them. It's called types.

127
00:14:05,240 --> 00:14:11,540
Type 1 is the one that is still relevant,
to a certain degree.

128
00:14:11,540 --> 00:14:16,760
Those are the ones you can probably

129
00:14:16,760 --> 00:14:21,400
find on a standard Debian installation
for example.

130
00:14:21,400 --> 00:14:23,880
It uses cubic bezier curves.

131
00:14:26,120 --> 00:14:35,760
The file format is divided into
different files.

132
00:14:35,760 --> 00:14:39,500
So for every font you have
Printer Font ASCII

133
00:14:39,500 --> 00:14:44,200
or a Printer Font Binary file,
and you have

134
00:14:44,200 --> 00:14:49,120
a Print Font Metric or
Adobe Font Metric file.

135
00:14:54,740 --> 00:15:00,900
Then you have the Truetype file format.

136
00:15:02,860 --> 00:15:07,700
This is more common. I guess everyone
heard of that already.

137
00:15:08,940 --> 00:15:12,140
It uses quadratic bezier curves.

138
00:15:13,760 --> 00:15:21,420
It can contain optional code for
TrueType Hinting Virtual Machine.

139
00:15:21,420 --> 00:15:25,120
What that means I will explain latter.

140
00:15:25,120 --> 00:15:30,740
There's a third format,
the OpenType format,

141
00:15:30,740 --> 00:15:35,160
which has two possible glyph formats:
one is TrueType,

142
00:15:35,160 --> 00:15:40,980
and the other is Compact Font Format,
which is based on Postscript Type 2.

143
00:15:40,980 --> 00:15:47,880
So you can say what is new in this format,
or what's the difference?

144
00:15:47,880 --> 00:15:51,700
Well it supports so-called Smartfonts.

145
00:15:53,580 --> 00:15:59,600
That means you can have language-specific
ligatures or character substitutions.

146
00:16:01,360 --> 00:16:09,560
For example, kerning classes, which means
you have a class of characters like

147
00:16:09,560 --> 00:16:13,520
the A and different variations.

148
00:16:13,520 --> 00:16:19,820
So these are A with different diacritic
symbols,

149
00:16:19,820 --> 00:16:30,560
and you can just use one kerning class for
all of those characters and don't have to

150
00:16:30,560 --> 00:16:37,580
invent the wheel for every A with
diacritic symbols anew.

151
00:16:43,540 --> 00:16:50,140
Now to the font rendering techniques that
I use today.

152
00:16:53,540 --> 00:17:02,360
This only applies to the outline fonts
because well rendering bitmap fonts is

153
00:17:02,360 --> 00:17:11,020
obviously quite easy. You just paint the
pixels that are in the bitmap.

154
00:17:11,020 --> 00:17:17,480
So rasterization is all about using
outline fonts.

155
00:17:19,280 --> 00:17:24,619
The one library library that is used all
over the free and open source world

156
00:17:24,619 --> 00:17:26,180
is FreeType.

157
00:17:26,180 --> 00:17:40,600
It is used on Linux system, BSD desktops,
Android, and ReactOS, and some others.

158
00:17:40,600 --> 00:17:47,300
For example it is contained in Ghostscript
and therefore in most of the printers.

159
00:17:49,040 --> 00:17:52,140
It's also on iOS [exhale].

160
00:17:53,140 --> 00:17:59,750
So the naive rasterization algorithm would
be just lay a pixel raster over the

161
00:17:59,750 --> 00:18:06,350
outline font, over the character you want
to display, and if the center of the pixel

162
00:18:06,350 --> 00:18:09,900
is inside the outline then you
set the color to black.

163
00:18:14,960 --> 00:18:19,340
The problem is the so called
aliasing effect.

164
00:18:19,340 --> 00:18:23,820
This is what you can see
in the picture below.

165
00:18:23,820 --> 00:18:29,760
So those are the same words,
rendered at different resolutions.

166
00:18:29,760 --> 00:18:36,440
The left one has 10x the resolution
of the right one.

167
00:18:38,620 --> 00:18:49,540
You can see that, for example,
the 'w' is quite deformed.

168
00:18:49,540 --> 00:18:55,340
Or the curl of the 'g';
there's even a part missing.

169
00:18:55,340 --> 00:18:59,800
So you have details of the font
which are lost,

170
00:18:59,800 --> 00:19:02,040
and you have artefacts.

171
00:19:04,240 --> 00:19:11,580
Somehow, especially in the early computing
days you wanted to reduce those,

172
00:19:11,580 --> 00:19:15,480
and therefore you used a technique
called hinting.

173
00:19:15,480 --> 00:19:20,820
This is to avoid such artefacts and
improve the readability

174
00:19:20,820 --> 00:19:22,520
at lower resolutions.

175
00:19:22,520 --> 00:19:34,660
Therefore the outline is adjusted to fit
the pixel raster at the rasterization.

176
00:19:36,900 --> 00:19:41,840
Some of the fonts can contain
instructions, the so-called hints

177
00:19:41,840 --> 00:19:46,020
where the the name comes from:
"hinting".

178
00:19:51,360 --> 00:19:58,860
You can see in the example here,
in the picture above,

179
00:19:58,860 --> 00:20:07,860
that it's quite a good result.

180
00:20:07,860 --> 00:20:15,480
This is much more readable
than the word above.

181
00:20:15,480 --> 00:20:22,560
However, with the use of hinting, there
are also characteristics of the font lost

182
00:20:24,200 --> 00:20:27,540
which is obvious because
if you change the outline

183
00:20:27,540 --> 00:20:31,160
then obviously characteristics get lost.

184
00:20:31,160 --> 00:20:37,260
And especially important for
word processing,

185
00:20:37,260 --> 00:20:39,640
what you see is what you get
word processing,

186
00:20:39,640 --> 00:20:43,680
is that the tracking
of the font is changed.

187
00:20:45,920 --> 00:20:49,960
So tracking means the width
of single characters.

188
00:20:49,960 --> 00:20:56,680
The picture below, this is a picture I
took from LibreOffice.

189
00:20:56,680 --> 00:21:05,300
If you have a close look, you can see
that the gap between those 'i' characters

190
00:21:05,300 --> 00:21:07,300
is not always the same.

191
00:21:08,040 --> 00:21:16,880
But if do word processing, you actually
want to have a result which looks the same

192
00:21:16,880 --> 00:21:18,880
as on the printout.

193
00:21:20,480 --> 00:21:26,840
So I would recommend not
to hint fonts in

194
00:21:26,840 --> 00:21:29,860
a what you see is what you get
word processor.

195
00:21:33,520 --> 00:21:40,980
If you have a look beyond the backyard,
on macOS there exists no hinting,

196
00:21:40,980 --> 00:21:45,780
and in the Windows world, hint can't
be turned off,

197
00:21:45,780 --> 00:21:52,320
so this is hardwired in the
font rendering of the Windows system.

198
00:21:56,120 --> 00:22:03,480
Well another approach to improve
readability is anti-aliasing

199
00:22:03,480 --> 00:22:08,400
which applies multisampling.

200
00:22:08,400 --> 00:22:15,920
So for every pixel you take samples at
different spots

201
00:22:15,920 --> 00:22:22,240
and then you compute from
that a gray value,

202
00:22:22,240 --> 00:22:29,240
which is a measure of how much of the
area of the pixel is covered by the glyph.

203
00:22:33,260 --> 00:22:40,040
On the picture you can see again
the simple raster word,

204
00:22:40,040 --> 00:22:45,840
and then in the middle you see the word
with anti-aliasing,

205
00:22:46,240 --> 00:22:56,000
and below you can see a combination of
hinting and antialiasing.

206
00:22:58,700 --> 00:23:02,860
Suddenly the text becomes very readable
also on low resolutions.

207
00:23:04,740 --> 00:23:12,460
This is what was usually used in
computing in the 90s.

208
00:23:18,440 --> 00:23:23,560
So there is another approach to improve
and therefore I have to

209
00:23:23,560 --> 00:23:27,080
talk a bit about LCD displays.

210
00:23:27,080 --> 00:23:37,140
So in the picture on the left, above you
can see tube monitor pixels and

211
00:23:37,140 --> 00:23:40,680
on the bottom you can see
LCD monitor pixels.

212
00:23:40,680 --> 00:23:50,400
All of the pixels consist of so-called
subpixels with different colors.

213
00:23:52,160 --> 00:23:55,940
The mixture of the three different colors

214
00:23:55,940 --> 00:24:01,660
gives them a wide range
of different colors.

215
00:24:04,560 --> 00:24:12,540
With the tube monitors this is not used,
but with LCD display

216
00:24:12,540 --> 00:24:18,680
depending on the
configuration of the subpixels

217
00:24:18,680 --> 00:24:23,320
it can be used to improve improve the
resolution in one direction.

218
00:24:23,320 --> 00:24:29,400
Therefore you have to know how the
configuration of the display is.

219
00:24:29,400 --> 00:24:36,980
So usually, one pixel, which you can see
in the picture below right?

220
00:24:36,980 --> 00:24:40,120
These are the usual computer monitors.

221
00:24:40,120 --> 00:24:51,860
One pixel consists of a red, green and a
blue subpixel in this order.

222
00:24:51,860 --> 00:24:58,400
But you have to keep in mind, especially
with tablets, or smartphones,

223
00:24:58,400 --> 00:25:05,200
you can rotate the screen, so you have to
keep that in mind.

224
00:25:06,060 --> 00:25:11,280
Also there are other subpixel
configurations.

225
00:25:11,280 --> 00:25:17,880
For example, depending on the technology
there can be additional red or green

226
00:25:17,880 --> 00:25:20,180
or even white subpixels.

227
00:25:24,180 --> 00:25:30,400
So there are also multiple possibilities
of the configuration.

228
00:25:33,840 --> 00:25:39,500
We can use this configuration as I said
to improve the resolution

229
00:25:39,500 --> 00:25:45,000
and in the usual case
this is horizontally.

230
00:25:45,000 --> 00:25:50,440
You can see on the picture
on the left side,

231
00:25:52,800 --> 00:25:59,400
first there's the naive,
simple rendered character,

232
00:25:59,400 --> 00:26:03,880
then the character
just using anti-aliasing,

233
00:26:03,880 --> 00:26:08,340
and then there's the
subpixel rendered character.

234
00:26:10,060 --> 00:26:16,260
This one is the most readable
or most sharp character.

235
00:26:16,260 --> 00:26:25,100
Not sharp!... but it's most correctly
rendered according to the outline font.

236
00:26:25,960 --> 00:26:31,420
Depending on the technique of the display,

237
00:26:31,420 --> 00:26:41,340
you can see a color haze
around the characters.

238
00:26:44,080 --> 00:26:49,260
So this happens when the software
and the display technology

239
00:26:49,260 --> 00:26:52,020
don't match each other.

240
00:26:54,180 --> 00:26:59,320
So this is what you can see
on the picture on the right.

241
00:27:01,340 --> 00:27:07,900
Okay, let's talk about the font rendering
software parts in the Linux desktop.

242
00:27:10,660 --> 00:27:15,340
There's the so-called server-side
text rendering.

243
00:27:16,600 --> 00:27:21,760
So in the X server there's the
Core Font subsystem.

244
00:27:25,040 --> 00:27:31,940
With that, X11 clients can request the
server to display a text

245
00:27:31,940 --> 00:27:36,160
by sending a string via libXfont

246
00:27:36,160 --> 00:27:45,220
and using the so-called
X Logical Font Description (XLFD).

247
00:27:45,220 --> 00:27:52,920
Here's an example for Adobe Career font,

248
00:27:52,920 --> 00:28:02,600
then the X server has to
render the text using the font.

249
00:28:05,980 --> 00:28:10,940
If you imagine a terminal server setup
with thin clients,

250
00:28:10,940 --> 00:28:18,500
then the thin client runs the X server
and the terminal server runs the X client

251
00:28:18,500 --> 00:28:27,620
and every thin client then has to
handle the font rendering.

252
00:28:27,620 --> 00:28:34,520
So I don't know if
this is the only reason,

253
00:28:34,520 --> 00:28:40,880
but nowadays server-side font
rendering is not so common.

254
00:28:40,880 --> 00:28:47,620
Probably not used anymore.

255
00:28:52,540 --> 00:28:56,160
Now I have to talk first
about font management.

256
00:28:56,160 --> 00:29:01,720
In Linux systems there is
a software called fontconfig,

257
00:29:01,720 --> 00:29:05,280
which manages installed fonts
on the system

258
00:29:05,280 --> 00:29:15,640
and it configures for example how to
substitute fonts.

259
00:29:17,160 --> 00:29:24,280
For example if in a document there's a
font to render a text

260
00:29:24,280 --> 00:29:27,120
and the font is not
available on the system

261
00:29:27,120 --> 00:29:33,860
then in the font config system there can
be rules to replace the font

262
00:29:33,860 --> 00:29:36,640
with a similar font.

263
00:29:37,380 --> 00:29:41,020
This is heavily used in Linux systems.

264
00:29:41,020 --> 00:29:47,760
There are also rules for what font to
use if the current selected font

265
00:29:47,760 --> 00:29:51,480
doesn't contain a character
you want to display.

266
00:29:52,940 --> 00:29:59,020
You can see on the picture on the right
that this is also used...

267
00:29:59,020 --> 00:30:01,800
although I have to admit,

268
00:30:01,800 --> 00:30:07,920
I had to take this picture on a Debian 5.0
system in LibreOffice

269
00:30:07,920 --> 00:30:12,000
because nowadays
it works a bit different,

270
00:30:12,000 --> 00:30:17,780
but this is a good example where
you can see that those characters

271
00:30:17,780 --> 00:30:20,820
come from different fonts actually.

272
00:30:23,220 --> 00:30:27,920
There's also a command line tool
which is quite nice.

273
00:30:27,920 --> 00:30:29,580
fc-match command line tool.

274
00:30:29,580 --> 00:30:37,460
So for example if you want to see what is
the replacement font for, let's say, Arial

275
00:30:37,460 --> 00:30:40,960
then you get the output:
okay, it's Nimbus Sans.

276
00:30:44,840 --> 00:30:47,960
And you can also set rendering options,

277
00:30:47,960 --> 00:30:55,880
which means you can set anti-aliasing
or you can turn off hinting.

278
00:31:00,260 --> 00:31:06,700
Usually these configurations are stored in
/etc/fonts

279
00:31:06,700 --> 00:31:11,800
and there is also a per-user configuration
in .config/fontconfig

280
00:31:11,800 --> 00:31:19,680
and it's in XML file format snippets.

281
00:31:21,500 --> 00:31:24,920
In the picture you can see an example.

282
00:31:24,920 --> 00:31:33,020
This is the replacement rule for
Carlito and Calibri.

283
00:31:35,540 --> 00:31:41,540
Carlito is a replacement font for the
nowadays often used

284
00:31:41,540 --> 00:31:44,200
Calibri font from Microsoft.

285
00:31:45,780 --> 00:31:54,380
So this configuration says the one way,
Carlito is the same as Calibri,

286
00:31:54,380 --> 00:31:56,240
and the other way around.

287
00:31:56,240 --> 00:31:58,280
This is just an example,

288
00:31:58,280 --> 00:32:03,940
you can have a look at /etc/fonts
and a lot of such snippets.

289
00:32:07,340 --> 00:32:12,640
It defines how fonts are
displayed on the system.

290
00:32:16,180 --> 00:32:23,720
Another thing, and this is the reason
why I had to take the screenshot

291
00:32:23,720 --> 00:32:29,780
on an older system, there's a piece of
software called HarfBuzz.

292
00:32:29,780 --> 00:32:35,240
HarfBuzz is Persian for OpenType,

293
00:32:35,240 --> 00:32:41,460
so this software relies on the OpenType
font format.

294
00:32:41,460 --> 00:32:46,400
You can see on the right side
the HarfBuzz logo

295
00:32:46,400 --> 00:32:50,180
that actually says
HarfBuzz in Persian.

296
00:32:53,500 --> 00:32:56,240
Before I talked about ligatures,

297
00:32:56,240 --> 00:33:02,840
In some languages ligatures are required
to render fonts correctly

298
00:33:02,840 --> 00:33:09,220
and this is an example on the left of
Devanagari, which is an Indic script.

299
00:33:11,720 --> 00:33:17,700
So if you have the first two characters
combined then this is the rule

300
00:33:17,700 --> 00:33:24,500
of how to replace those characters
with a third glyph.

301
00:33:29,480 --> 00:33:34,280
There were early implementations
by Qt and Pango

302
00:33:34,280 --> 00:33:38,740
and those were integrated in HarfBuzz.

303
00:33:41,140 --> 00:33:44,780
Well those parts are now known as
Harfbuzz Old,

304
00:33:44,780 --> 00:33:50,220
and the current HarfBuzz is a rewrite.

305
00:33:51,580 --> 00:33:57,020
Nowadays it's also used for
the so-called simple script,

306
00:33:59,260 --> 00:34:03,660
meaning especially Latin script,

307
00:34:03,660 --> 00:34:12,060
and is integrated into Qt, GTK,
LibreOffice, Firefox, Android, and XETEX.

308
00:34:12,060 --> 00:34:14,880
This is what I use for the slides here,

309
00:34:14,880 --> 00:34:20,840
so all the slides here are
also rendered using HarfBuzz.

310
00:34:20,840 --> 00:34:24,880
And of course the whole
font rendering stack.

311
00:34:26,300 --> 00:34:34,860
HarfBuzz also has fancy features like
variable widths or weight

312
00:34:34,860 --> 00:34:45,760
with only one font or you can define
in the font characters with

313
00:34:45,760 --> 00:34:55,540
variable widths and without stepping you
can change it using HarfBuzz.

314
00:34:59,940 --> 00:35:04,760
Those techniques are used in
client-side rendering.

315
00:35:06,860 --> 00:35:15,100
One library often was
until recently often used, Xft.

316
00:35:17,820 --> 00:35:22,480
Well this is the applications meaning the
X clients render the text

317
00:35:24,060 --> 00:35:27,280
based on FreeType and fontconfig.

318
00:35:27,800 --> 00:35:31,240
Then the X server
only displays the results.

319
00:35:32,160 --> 00:35:36,140
Well, there is some caching involved,

320
00:35:36,140 --> 00:35:42,200
and it requires
an extension to the protocol.

321
00:35:51,160 --> 00:35:56,120
In the widget libraries this was also
used a long time,

322
00:35:56,120 --> 00:36:01,540
but now Qt, for example, has its own
code for font rendering

323
00:36:01,540 --> 00:36:05,240
based on HarfBuzz, FreeType,
and fontconfig.

324
00:36:05,240 --> 00:36:09,140
There's the combination of
Pango and Cairo,

325
00:36:09,140 --> 00:36:13,000
which is used in the GTK environment.

326
00:36:13,000 --> 00:36:22,660
Pango derives from Greek and Japanese:
pan means all and go means languages.

327
00:36:22,660 --> 00:36:29,660
So this is the background to write
in all languages.

328
00:36:29,660 --> 00:36:34,000
This also uses HarfBuzz, FreeType,
and fontconfig.

329
00:36:34,000 --> 00:36:39,780
And if you look at Wayland clients,
they only do client-side rendering.

330
00:36:42,660 --> 00:36:48,140
To sum it up, we have a variety of
techniques for text display.

331
00:36:50,340 --> 00:36:53,600
Some have historical than
practical value nowadays.

332
00:36:53,600 --> 00:36:58,940
The modern font rendering stack
is quite complex.

333
00:37:03,840 --> 00:37:08,820
But writing is one of the
main interface to computers,

334
00:37:08,820 --> 00:37:12,160
so developers should be aware
of the complexity.

335
00:37:14,460 --> 00:37:16,560
Keep that in mind.

336
00:37:17,720 --> 00:37:18,540
Thank you.

337
00:37:20,280 --> 00:37:24,080
[applause]

338
00:37:33,640 --> 00:37:35,440
Are there any questions?

339
00:37:41,100 --> 00:37:45,040
[audience] More a request than a question,
I find the topic very interesting

340
00:37:45,040 --> 00:37:51,240
and I'd like to check it again. I know
your video was not recorded

341
00:37:51,240 --> 00:37:53,640
or I think it was not recorded...

342
00:37:53,640 --> 00:37:57,080
[Max] Well it was I think.

343
00:37:58,340 --> 00:38:04,550
[audience] Okay so nevermind, but still
if you are able to share your presentation

344
00:38:04,550 --> 00:38:05,380
[Max] Yes

345
00:38:05,380 --> 00:38:08,300
[audience] I would be very
happy to look at it. Thank you.

346
00:38:16,960 --> 00:38:25,640
[audience] [tests mic] What's
the problem due to the

347
00:38:25,640 --> 00:38:32,900
complexity from the software stack
in your open ??.

348
00:38:32,900 --> 00:38:36,240
[Max] The problem of what?

349
00:38:36,240 --> 00:38:48,320
[audience] What's the problem it came from
this complex software stack

350
00:38:48,320 --> 00:38:50,320
in your open ??.

351
00:38:50,320 --> 00:38:59,420
There's no problem with that,
or there's some problem

352
00:38:59,420 --> 00:39:11,300
with these lot of layers, very lot of
components to render the font.

353
00:39:11,300 --> 00:39:17,440
[Max] Okay, I try to rephrase the question
[audience] Please.

354
00:39:17,440 --> 00:39:22,820
[Max] What is the reason there is so many
layers in the font rendering stack today.

355
00:39:22,820 --> 00:39:23,980
[Max] Is that correct?

356
00:39:23,980 --> 00:39:38,120
[audience] And it caused some problem. Do
you know any problem

357
00:39:38,120 --> 00:39:41,600
with current font rendering system.

358
00:39:41,600 --> 00:39:43,700
[Max] Colored font rendering system?

359
00:39:43,700 --> 00:39:45,700
[audience] Current, now.

360
00:39:48,040 --> 00:39:49,440
[Max] Ah current font-

361
00:39:49,440 --> 00:39:52,500
[audience 2] The question is
whether the complexity

362
00:39:52,500 --> 00:39:55,520
means that there are
difficulties for developers.

363
00:39:55,520 --> 00:39:56,700
Is it too complex?

364
00:39:56,700 --> 00:39:58,200
Does that cause problems?

365
00:39:58,200 --> 00:40:02,640
[Max] Well the complexity is hidden behind
the font rendering stack.

366
00:40:02,640 --> 00:40:10,560
So it's a huge collection of software,

367
00:40:10,560 --> 00:40:17,620
usually there's HarfBuzz, fontconfig,
and FreeType heavily used nowadays.

368
00:40:17,620 --> 00:40:22,300
But it's all encapsulated
in these libraries

369
00:40:22,300 --> 00:40:29,140
and it's used all over
the free software world

370
00:40:30,240 --> 00:40:39,080
and it makes it easy to write applications
which are easily translatable.

371
00:40:39,840 --> 00:40:47,800
[audience] Yes but for example,
the fontconfig is not so flexible.

372
00:40:47,800 --> 00:40:55,080
For example, when we're using
mainly Japanese

373
00:40:55,080 --> 00:41:01,800
and other display of the language,

374
00:41:01,800 --> 00:41:13,160
then the font of config chooses the
non-Japanese font like the Chinese one.

375
00:41:13,160 --> 00:41:28,220
I know some distributions like Ubuntu make
language specific fontconfig file

376
00:41:28,220 --> 00:41:36,500
for each language to deal with but
Debian doesn't have such a mechanism.

377
00:41:38,880 --> 00:41:47,800
So in my opinion the fontconfig
is a bit terrible so

378
00:41:47,800 --> 00:41:55,260
is there any ?? meant or any hack for it?

379
00:41:55,260 --> 00:42:04,760
[Max] Okay, the fontconfig system comes
from the time where XML was popular.

380
00:42:04,760 --> 00:42:06,600
[audience] Mhmm
[Max] As you can see.

381
00:42:08,520 --> 00:42:15,360
Well the problem here is
not so much the software stack

382
00:42:15,360 --> 00:42:18,960
more than the Unicode system.

383
00:42:18,960 --> 00:42:25,300
So in the Unicode system there are
same code points for

384
00:42:25,300 --> 00:42:31,240
Japanese and Chinese characters somewhere
although they have different appearances.

385
00:42:31,240 --> 00:42:39,200
In the fontconfig system there are
replacement rules for characters

386
00:42:39,200 --> 00:42:48,380
and it is just a list and usually Chinese
fonts are listed first.

387
00:42:48,380 --> 00:42:54,540
So that is the reason why in the Japanese
language you get Chinese characters

388
00:42:54,540 --> 00:42:56,620
instead of Japanese characters.

389
00:42:56,620 --> 00:43:01,760
So I also think there's room to improve
the software stack, yes.

390
00:43:01,760 --> 00:43:03,180
[audience] Thank you.

391
00:43:15,500 --> 00:43:19,520
[Max] Okay, done. Thank you.

392
00:43:20,080 --> 00:43:24,640
[applause]