[Theme Handbook Overhaul] Guides > JavaScript Best Practices

[justintadlock]

This ticket is a part of #816 and will be used for creating new page titled "JavaScript Best Practices" under the Guides chapter.

The content for the new page will be drafted in a Google Doc: https://docs.google.com/document/d/1r0m22wfTH65HGaDk1w-ja6xmlyiScGUuWltsYzBtszI/edit?usp=sharing

Note: this is an update of an existing doc.

CC: @alexdeborba

[github-actions]

Heads up @kafleg @carolinan @TeBenachi - the "themes" label was applied to this issue.

[github-actions]

Heads up @WordPress/docs-issues-coordinators, we have a new issue open. Time to use 'em labels.

[alexdeborba]

I will be responsible for drafting the requested document.

[justintadlock]

I want to temporarily hold off on updating this doc for the moment. I have someone who is expected to look over it old doc and provide some feedback on 1) whether we should keep it and 2) if we do keep it, what an outline for modern block theming would be in terms of JS best practices.

[justintadlock]

My current thought process is that I'm not sure that we need this document in the Theme Handbook. The goal is to push themers to building pure block themes, which should (with any luck) require little-to-no JavaScript. So much of what you might do really should be in a plugin.

Additionally, if anything, we should push those who need to use JS to dedicated docs on JS, such as: https://developer.wordpress.org/coding-standards/wordpress-coding-standards/javascript/

And editor-specific JS should be handled in the Block Editor Handbook: https://developer.wordpress.org/block-editor/

I'll leave this open for feedback from the handbook reps since this was included in the original outline for the handbook overhaul.

For now, let's not move forward with any work on this until a more formal decision is made.

[alexdeborba]

The document you refer to as "old" is best suited for classic themes, while the approach for block themes is entirely different. As you mentioned, the JS approach for block themes involves building blocks, except for adding custom Vanilla JS to a theme. I took this last approach initially, but as a theme developer, I am now reconsidering. It would be confusing to mix both approaches, as they are pretty distinct.

[flexseth]

@justintadlock and @alexdeborba the only thing that might be helpful to mention, from a block theming & JavaScript angle, would be referencing coding standards.

For example, if someone wants to pass theme review (more easily and save the Theme Review team time) there may be coding standards they need to follow.

JavaScript Best Practices - Coding Standards (via DevHub)

Wanted to mention this may be an important piece of info to have in the Theme Handbook!

From: [Theme Review Handbook] -JS requirements (https://make.wordpress.org/themes/handbook/review/required/#4-code)

There must not be any PHP or JavaScript errors, warnings, or notices.