WordPress.org

Make WordPress Core

Opened 3 years ago

Last modified 2 years ago

#18820 reopened enhancement

Formatting bar loading experience is subpar

Reported by: markjaquith Owned by: azaozz
Milestone: Future Release Priority: normal
Severity: normal Version: 3.2.1
Component: Editor Keywords:
Focuses: Cc:

Description

When you save a post, the way the formatting bar loads in (Visual and HTML both) is subpar. It pops in really late, and shoves your post content down.

Screencast: http://s3.amazonaws.com/txfx/screencasts/Formatting-Toolbar.mov

Let's make this better.

Change History (10)

comment:1 jane3 years ago

Agreed. This drives me crazy. We brought it up in 3.2 cycle, too.

comment:2 jane3 years ago

  • Keywords ux-feedback removed

comment:3 azaozz3 years ago

In [18829]:

Attempt to keep the textarea still while loading the editor, see #18820

comment:4 follow-up: trepmal2 years ago

Similar thing happening with the width - http://screencast.com/t/RypBW4M50

My personal fix is to copy the width style to the <head>

add_action('admin_head', 'editor_css_fix');
function editor_css_fix() { ?>
	<style type="text/css">
	.wp-editor-container textarea.wp-editor-area {
		width: 99.9%;
	}
	</style>
<?php }

comment:5 nacin2 years ago

  • Component changed from General to Editor
  • Milestone changed from Awaiting Review to 3.3
  • Severity changed from normal to major

comment:6 in reply to: ↑ 4 ; follow-up: azaozz2 years ago

Replying to trepmal:

From the screencast it seems editor-buttons.css loads late because your connection is (very) slow. We can add that css to wp-admin.css, also outputting editor-buttons.css earlier should help.

comment:7 azaozz2 years ago

  • Owner set to azaozz
  • Resolution set to fixed
  • Status changed from new to closed

In [19126]:

Output editor-buttons.css earlier so the browser renders the editor in time, fixes #18820

comment:8 in reply to: ↑ 6 ; follow-ups: nacin2 years ago

  • Severity changed from major to normal

Replying to azaozz:

Replying to trepmal:

From the screencast it seems editor-buttons.css loads late because your connection is (very) slow. We can add that css to wp-admin.css, also outputting editor-buttons.css earlier should help.

Nice fix. FWIW though, I was able to see this on localhost consistently.

I'm re-opening as http://s3.amazonaws.com/txfx/screencasts/Formatting-Toolbar.mov (the original report) is still a problem.

comment:9 in reply to: ↑ 8 SergeyBiryukov2 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

Replying to nacin:

I'm re-opening as http://s3.amazonaws.com/txfx/screencasts/Formatting-Toolbar.mov (the original report) is still a problem.

comment:10 in reply to: ↑ 8 azaozz2 years ago

  • Milestone changed from 3.3 to Future Release

Replying to nacin:

Not sure we can do anything else to minimize the jumpiness there. TinyMCE is big, doesn't load fast, and places an iframe exactly on top of the textarea so there will always be some visual changes.

Next step can probably be to place a blocking div on top of it with a spinner in the middle until it loads completely. Beta3 is a bit too late for that though, moving to 3.4.

Note: See TracTickets for help on using tickets.