Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

add notes about CSS animation performance #2654

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
iliakan merged 1 commit into javascript-tutorial:master from ZYinMD:patch-24
Jun 24, 2021
Merged

add notes about CSS animation performance #2654

iliakan merged 1 commit into javascript-tutorial:master from ZYinMD:patch-24
Jun 24, 2021

Conversation

@ZYinMD
Copy link
Contributor

@ZYinMD ZYinMD commented Jun 24, 2021

Closes #2652.

@iliakan iliakan merged commit 9b99012 into javascript-tutorial:master Jun 24, 2021
Copy link
Member

iliakan commented Jun 24, 2021
edited
Loading

Thanks! I changed some phrases and rearranged them a little bit, please see https://javascript.info/css-animations#performance, PR if something should be fixed =)

Copy link
Contributor Author

ZYinMD commented Jun 24, 2021

Thanks. I want to point out that I have once seen a sentence here that mentioned that paint is often the slowest step, not layout.

Copy link
Member

iliakan commented Jun 24, 2021

Better now?

ZYinMD reacted with thumbs up emoji ZYinMD reacted with rocket emoji

Copy link
Member

Nice job, doc
👍

Copy link
Member

layout vs paint
I guess it depends on cpu/gpu/screen hardware

Copy link
Member

Hi Ilya,
is 440 grammar ok? sounds odd
I would also write "mozilla gecko" or just "firefox" so it doesnt sound like a stowaway

Copy link
Member

iliakan commented Jun 26, 2021

@joaquinelio what's wrong? Is 440 a line number?

Copy link
Member

joaquinelio commented Jun 26, 2021
edited
Loading

oops sorry
Not sure
your Engl is better thn mine
no problems in translating it, anyway

440 The opacity property also never causes Layout (also skips Paint in Gecko). We can...

Copy link
Member

joaquinelio commented Jun 26, 2021
edited
Loading

my bad. "also never" seems correct.
apologies

but the 2nd silly suggestion may stand...

Copy link
Member

iliakan commented Jun 26, 2021

@joaquinelio Changed to Mozilla Firefox.

Copy link
Contributor Author

ZYinMD commented Jun 26, 2021
edited
Loading

Yes 440 is a line number. It is now 442.

The opacity property also never causes Layout (also skips Paint in Mozilla Gecko). We can...

Yes I agree it sounds weird to say somethings "causes Layout". It'd be better to say it "triggers Layout", even better if we say it "triggers the Layout step".

Line 438 also uses "cause" which could be changed to "trigger".

I originally used 1 and 1 2 and 1 2 3 when talking about these triggers, which was good too. It more clearly makes readers understand that these steps are sequential - if you trigger 1, then 2 3 will trigger too.

Copy link
Member

iliakan commented Jun 26, 2021

@ZYinMD changed to trigger.

Copy link
Member

Uhm...
@iliakan
you added a redundant line 46 (link to bezier is in line 40 too)

sounds to me
"...you might want to check the previous article you just read in this very same chapter :)

I would combine it with line 40, or place it before 40 below the heading.

Copy link
Member

iliakan commented Jun 28, 2021
edited
Loading

removed the extra phrase.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Mention performance concerns of CSS animations on properties other than opacity and transform

AltStyle によって変換されたページ (->オリジナル) /