wp-calypso icon indicating copy to clipboard operation
wp-calypso copied to clipboard

Fix excerpt text in reader

Open eoigal opened this issue 2 years ago β€’ 4 comments

The reader isn't rendering the post excerpt correctly.

We have set it to output the no html text but this removes all tags, including the <br> tags. This means text that was meant to be on a new line is now on the same line and with incorrect spacing.

Example from here with update/reader-card-refresh branch Screenshot 2022-09-22 at 17 15 29

With this PR Screenshot 2022-09-22 at 17 16 56

eoigal avatar Sep 22 '22 16:09 eoigal

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

App Entrypoints (~512 bytes added πŸ“ˆ [gzipped])

name                   parsed_size           gzip_size
entry-main                  -530 B  (-0.0%)      -24 B  (-0.0%)
entry-stepper               +459 B  (+0.0%)     +529 B  (+0.1%)
entry-gutenboarding          -46 B  (-0.0%)       -1 B  (-0.0%)
entry-domains-landing        -46 B  (-0.0%)       -1 B  (-0.0%)
entry-browsehappy            -46 B  (-0.0%)       -1 B  (-0.0%)
entry-login                  -29 B  (-0.0%)       +5 B  (+0.0%)

Common code that is always downloaded and parsed every time the app is loaded, no matter which route is used.

Sections (~856 bytes removed πŸ“‰ [gzipped])

name                             parsed_size           gzip_size
reader                               -5923 B  (-1.0%)     -851 B  (-0.5%)
site-blocks                           -929 B  (-0.2%)     -285 B  (-0.2%)
home                                   +46 B  (+0.0%)      +22 B  (+0.0%)
devdocs                                -44 B  (-0.0%)      -10 B  (-0.0%)
themes                                 -27 B  (-0.0%)       -4 B  (-0.0%)
theme                                  -27 B  (-0.0%)       -8 B  (-0.0%)
preview                                -27 B  (-0.0%)       -1 B  (-0.0%)
woocommerce-installation               +17 B  (+0.0%)       +6 B  (+0.0%)
woocommerce                            +17 B  (+0.0%)       +6 B  (+0.0%)
site-purchases                         +17 B  (+0.0%)       +6 B  (+0.0%)
settings-writing                       +17 B  (+0.0%)       +6 B  (+0.0%)
settings-security                      +17 B  (+0.0%)       +6 B  (+0.0%)
settings-performance                   +17 B  (+0.0%)       +6 B  (+0.0%)
settings-jetpack                       +17 B  (+0.0%)       +6 B  (+0.0%)
settings-discussion                    +17 B  (+0.0%)       +6 B  (+0.0%)
settings                               +17 B  (+0.0%)       +6 B  (+0.0%)
security                               +17 B  (+0.0%)       +6 B  (+0.0%)
scan                                   +17 B  (+0.0%)       +6 B  (+0.0%)
purchases                              +17 B  (+0.0%)       +6 B  (+0.0%)
purchase-product                       +17 B  (+0.0%)       +6 B  (+0.0%)
privacy                                +17 B  (+0.0%)       +6 B  (+0.0%)
plugins                                +17 B  (+0.0%)       +6 B  (+0.0%)
plans                                  +17 B  (+0.0%)       +6 B  (+0.0%)
people                                 +17 B  (+0.0%)       +6 B  (+0.0%)
notification-settings                  +17 B  (+0.0%)       +6 B  (+0.0%)
migrate                                +17 B  (+0.0%)       +6 B  (+0.0%)
media                                  +17 B  (+0.0%)       +6 B  (+0.0%)
me                                     +17 B  (+0.0%)       +6 B  (+0.0%)
marketplace                            +17 B  (+0.0%)       +6 B  (+0.0%)
marketing                              +17 B  (+0.0%)       +6 B  (+0.0%)
jetpack-social                         +17 B  (+0.0%)       +6 B  (+0.0%)
jetpack-search                         +17 B  (+0.0%)       +6 B  (+0.0%)
jetpack-connect                        +17 B  (+0.0%)       +6 B  (+0.0%)
jetpack-cloud-settings                 +17 B  (+0.0%)       +6 B  (+0.0%)
jetpack-cloud-pricing                  +17 B  (+0.0%)       +6 B  (+0.0%)
jetpack-cloud-plugin-management        +17 B  (+0.0%)       +6 B  (+0.0%)
jetpack-cloud-partner-portal           +17 B  (+0.0%)       +8 B  (+0.0%)
jetpack-cloud-agency-dashboard         +17 B  (+0.0%)       +6 B  (+0.0%)
jetpack-cloud                          +17 B  (+0.0%)       +6 B  (+0.0%)
import                                 +17 B  (+0.0%)       +6 B  (+0.0%)
hosting                                +17 B  (+0.0%)       +6 B  (+0.0%)
help                                   +17 B  (+0.0%)       +6 B  (+0.0%)
happychat                              +17 B  (+0.0%)       +6 B  (+0.0%)
gutenberg-editor                       +17 B  (+0.0%)       +6 B  (+0.0%)
google-my-business                     +17 B  (+0.0%)       +6 B  (+0.0%)
export                                 +17 B  (+0.0%)       +6 B  (+0.0%)
email                                  +17 B  (+0.0%)       +6 B  (+0.0%)
earn                                   +17 B  (+0.0%)       +6 B  (+0.0%)
domains                                +17 B  (+0.0%)       +6 B  (+0.0%)
customize                              +17 B  (+0.0%)       +6 B  (+0.0%)
concierge                              +17 B  (+0.0%)       +6 B  (+0.0%)
comments                               +17 B  (+0.0%)       +6 B  (+0.0%)
checkout                               +17 B  (+0.0%)       +6 B  (+0.0%)
backup                                 +17 B  (+0.0%)       +6 B  (+0.0%)
add-ons                                +17 B  (+0.0%)       +6 B  (+0.0%)
activity                               +17 B  (+0.0%)       +6 B  (+0.0%)
account-close                          +17 B  (+0.0%)       +6 B  (+0.0%)
account                                +17 B  (+0.0%)       +6 B  (+0.0%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Async-loaded Components (~3855 bytes added πŸ“ˆ [gzipped])

name                                                         parsed_size           gzip_size
async-load-design-blocks                                         +6084 B  (+0.3%)    +2167 B  (+0.4%)
async-load-calypso-reader-search-stream                           +844 B  (+1.0%)     +223 B  (+0.9%)
async-load-calypso-blocks-support-article-dialog-dialog           -726 B  (-0.6%)     -147 B  (-0.4%)
async-load-automattic-help-center                                 -713 B  (-0.1%)     -134 B  (-0.1%)
async-load-calypso-reader-sidebar                                 +688 B  (+0.5%)      +81 B  (+0.2%)
async-load-calypso-reader-site-stream                             +665 B  (+2.2%)     +228 B  (+2.4%)
async-load-calypso-reader-feed-stream                             +665 B  (+2.2%)     +230 B  (+2.4%)
async-load-calypso-components-web-preview-component               +549 B  (+0.1%)     +535 B  (+0.3%)
async-load-calypso-blocks-reader-full-post                        -161 B  (-0.4%)      +52 B  (+0.4%)
async-load-signup-steps-design-picker                              -44 B  (-0.0%)       -6 B  (-0.0%)
async-load-calypso-my-sites-site-settings-seo-settings-form        -44 B  (-0.0%)      -10 B  (-0.0%)
async-load-calypso-blocks-support-article-dialog                   -44 B  (-1.1%)      -19 B  (-1.1%)
async-load-calypso-layout-masterbar-drafts-popover                 +29 B  (+0.1%)      +20 B  (+0.1%)
async-load-calypso-reader-p-2-main                                 -22 B  (-0.7%)      -16 B  (-1.5%)
async-load-calypso-reader-conversations-stream                     -22 B  (-0.5%)      -10 B  (-0.6%)
async-load-calypso-reader-a-8-c-main                               -22 B  (-0.7%)      -16 B  (-1.5%)
async-load-signup-steps-theme-selection                            +17 B  (+0.0%)       +7 B  (+0.0%)
async-load-signup-steps-site-picker                                +17 B  (+0.0%)       +6 B  (+0.0%)
async-load-signup-steps-plans-atomic-store                         +17 B  (+0.0%)       +8 B  (+0.0%)
async-load-signup-steps-plans                                      +17 B  (+0.0%)       +6 B  (+0.0%)
async-load-signup-steps-p2-complete-profile                        +17 B  (+0.0%)       +6 B  (+0.0%)
async-load-signup-steps-difm-site-picker                           +17 B  (+0.0%)       +6 B  (+0.0%)
async-load-signup-steps-clone-point                                +17 B  (+0.0%)       +7 B  (+0.0%)
async-load-signup-steps-clone-destination                          +17 B  (+0.0%)       +7 B  (+0.0%)
async-load-signup-steps-clone-credentials                          +17 B  (+0.0%)       +7 B  (+0.0%)
async-load-design-playground                                       +17 B  (+0.0%)       +6 B  (+0.0%)
async-load-design                                                  +17 B  (+0.0%)       +6 B  (+0.0%)
async-load-calypso-my-sites-checkout-modal                         +17 B  (+0.0%)       +8 B  (+0.0%)
async-load-calypso-layout-guided-tours-component                   +17 B  (+0.0%)      +10 B  (+0.0%)
async-load-calypso-components-sites-popover                        +17 B  (+0.0%)       +6 B  (+0.0%)
async-load-calypso-blocks-legal-updates-banner                     +17 B  (+0.4%)       +7 B  (+0.4%)
async-load-calypso-blocks-inline-help-popover                      +17 B  (+0.0%)       +6 B  (+0.0%)

React components that are loaded lazily, when a certain part of UI is displayed for the first time.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory. Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

matticbot avatar Sep 22 '22 16:09 matticbot

Just tested this. Overall it looks good.

I ran into one minor issue. If you follow https://snapshotsincursive.com/ and scroll down about 14 posts, you'll see this one which only displays one line for some reason:

CleanShot 2022-09-22 at 13 37 52@2x

You can view the full post here:

https://snapshotsincursive.com/2022/09/18/autumns-second-spring/

Here's the HTML for the excerpt:

<div class="entry-content">
		
<p>β€œSummer ends, and Autumn comes,</p>



<p>and he who would have it otherwise</p>



<p>would have high tide always and</p>



<p>a full moon every night.”</p>



<p>~ Hal Borland</p>

davemart-in avatar Sep 22 '22 17:09 davemart-in

http://calypso.localhost:3000/read/feeds/34968577 should be showing 2 lines now in excerpt;

Screenshot 2022-09-22 at 22 05 05

eoigal avatar Sep 22 '22 21:09 eoigal