diff --git a/packages/block-library/src/navigation-link/edit.js b/packages/block-library/src/navigation-link/edit.js index e3018c274ef787..35357e0c8a9bba 100644 --- a/packages/block-library/src/navigation-link/edit.js +++ b/packages/block-library/src/navigation-link/edit.js @@ -26,6 +26,7 @@ import { store as blockEditorStore, getColorClassName, useInnerBlocksProps, + useBlockEditingMode, } from '@wordpress/block-editor'; import { isURL, prependHTTP, safeDecodeURI } from '@wordpress/url'; import { useState, useEffect, useRef } from '@wordpress/element'; @@ -99,15 +100,25 @@ const useIsInvalidLink = ( kind, type, id ) => { const isPostType = kind === 'post-type' || type === 'post' || type === 'page'; const hasId = Number.isInteger( id ); + const blockEditingMode = useBlockEditingMode(); + const postStatus = useSelect( ( select ) => { if ( ! isPostType ) { return null; } + + // Fetching the posts status is an "expensive" operation. Especially for sites with large navigations. + // When the block is rendered in a template or other disabled contexts we can skip this check in order + // to avoid all these additional requests that don't really add any value in that mode. + if ( blockEditingMode === 'disabled' ) { + return null; + } + const { getEntityRecord } = select( coreStore ); return getEntityRecord( 'postType', type, id )?.status; }, - [ isPostType, type, id ] + [ isPostType, blockEditingMode, type, id ] ); // Check Navigation Link validity if: