Les éléments “collants” (CSS position: sticky) sur Discourse ont toujours été un peu bancals sur mon iPad (9e génération, tout à jour). Ils tremblent un peu lors du défilement, réagissent mal, avec des délais, à un changement soudain de direction de défilement.
Avec l’introduction de la nouvelle barre latérale (également un élément “collant”), cela est devenu plus choquant, car il s’agit d’une partie importante de l’interface utilisateur qui n’est pas très stable.
Le coupable est la variable --header-offset. La suppression de cette variable en CSS rend les éléments “collants” de l’interface utilisateur stables, comme ils le devraient.
L’en-tête a une hauteur de 4em par défaut. J’ai remplacé la variable --header-offset en CSS pour la Timeline, Sticky-avatar et la barre latérale par 4em pour calculer leur position :
.d-header
{
box-sizing: border-box;
height: 4em;
}
.sidebar-wrapper
{
top: 4em;
height: calc(100vh - 4em);
}
@media screen and (min-width: 925px)
{
.container.posts .topic-navigation
{
top: 6em;
}
}
.topic-post.sticky-avatar .topic-avatar
{
top: 3.75em;
}
(box sizing est là parce que j’ai une bordure sur mon en-tête, sans rapport)
Je suis curieux de connaître la fonction de cette variable, l’en-tête ne change jamais de hauteur AFAIK, en dehors du changement de taille du texte, et l’utilisation de em pour sa hauteur s’en charge.
Je ne sais pas s’il existe un moyen d’optimiser --header-offset sur Safari mobile, mais ma solution de contournement résout ce petit problème de performance. Discourse a l’air beaucoup plus soigné lorsque les éléments “collants” sont vraiment “collants” 
(Je n’ai aucun problème avec ces éléments sur Firefox ou Chrome sur mon bureau, donc cela pourrait être un bug de Safari)