Using Payload 3.0:
I created a field to add links to internal pages:
{
name: 'internalHref',
label: 'Internal URL',
type: 'relationship',
relationTo: 'pages'
}Each page has a
slugfield that is extracted from this relationship and used for the link.
The issue I'm encountering is that this relationship returns
allof the page content, not just the slug, and significantly impacts the sites performance.
If I limit the
maxDepthon the relationship I just get back the ID, is there a way to link directly to the page from that ID, or another way to link to the page w/o returning all of the content from the page?
If you're not using GraphQL, unfortunately for now I don't think you can get only the specific fields the way you want it. You only get the whole JSON. AFAIK
@423216344302092288was working on a select fields plugin and there was discussions here about such feature in Payload 3, but not sure if there's been anything yet officially.
I have an old one [PR](
https://github.com/payloadcms/payload/pull/5942) it has a lot of conflicts at this point
I'm gonna back to this soon and this will be in Payload 3
at the moment
https://github.com/r1tsuu/payload-enchants/tree/master/packages/fields-selectand default select option
https://github.com/r1tsuu/payload-enchants/tree/master/packages/fields-select#default-select-option-for-relationship-fieldsI accomplished what I needed using field hooks and a hidden field for the true internalHref. It still deals with processing all of the data in the CMS, but performance isn't impacted when using the site because only the shortened slug is returned:
{
name: 'internalHref',
label: 'Internal URL',
type: 'relationship',
relationTo: 'pages',
maxDepth: 0,
hooks: {
beforeValidate: [
async ({ value, req }) => {
if (typeof value === 'number') {
const pageData = await req.payload.findByID({
id: value,
locale: 'en-US',
collection: 'pages'
});
return pageData?.id;
}
return value;
}
]
},
admin: {
condition: (_, siblingData) => siblingData.type === 'internal',
description: 'Route for link'
}
},
{
name: 'shortenedInternalLInk',
label: 'Internal Link',
admin: {
hidden: true
},
type: 'text',
hooks: {
beforeValidate: [
async ({ value, req, siblingData }) => {
if (typeof siblingData?.internalHref === 'number') {
const pageData = await req.payload.findByID({
id: siblingData?.internalHref,
locale: 'en-US',
collection: 'pages'
});
return `/${pageData?.slug}`;
}
return value;
}
]
}
},So you're still doing the computation (fetching the whole document), just not filling the memory with useless data?
yep. now the header + footer isn't pulling in all of the block data for every single internally linked page, which was vastly degrading performance when browsing the site.
its a bit slower publishing the page now because of this hook, but overall performance is much better now.
Star
Discord
online
Get dedicated engineering support directly from the Payload team.