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

Navigation sub menu rendering #5586

Closed
db-ra opened this Issue Mar 31, 2017 · 12 comments

Comments

Projects
None yet
10 participants
@db-ra

db-ra commented Mar 31, 2017

What problem does this feature solve?

When loading a menu, submenu items are rendered only when you click on root element of the menu - this is bad for SEO. We need a feature where entire menu is rendered on load.

What does the proposed API look like?

when menu is rendered, submenu elements should be inside DOM

@useless-stuff

This comment has been minimized.

useless-stuff commented Mar 31, 2017

Yep same problem here when I've started to use this awesome framework :)
Are there some reasons why the menu or other components hide by default the content?
I'm not an SEO expert but that means that the search engines can't see the content, right?
Especially in a menu component that link the most important parts of the application, the content should be rendered on the page.
Are there some tricks to do that?
Thank you in advance for any clues about that :)

@plandem

This comment has been minimized.

Contributor

plandem commented Mar 31, 2017

I suppose the only reason - optimization for performance.

@massa-man

This comment has been minimized.

massa-man commented Mar 31, 2017

Not rendering the content until required makes complete sense for performance, but for a component like Menu, it is a big issue with SEO, since bots don't go around the page triggering click and hover events on DOM objects just to see if anything else gets rendered into the DOM, so using this Menu as the main application menu on a public application makes the application very SEO unfriendly.

There should by a prop in the Menu component that allows us to render the child objects by default. Set is as false by default for performance reasons, but allow developers to override that behaviour when using this in public, crawlable applications.

@plandem

This comment has been minimized.

Contributor

plandem commented Apr 1, 2017

I was sure that for SEO a good practice is server-side rendering

@bang88

This comment has been minimized.

Member

bang88 commented Apr 1, 2017

Yep, need fix. I have a server-side rendering example using asp.net core.

https://github.com/bang88/aspnet-core-react-antd-boilerplate

@massa-man

This comment has been minimized.

massa-man commented Apr 1, 2017

@benjycui

This comment has been minimized.

Contributor

benjycui commented Apr 26, 2017

Pending for: react-component/menu#19

And we need to add a feature to rc-trigger, to force rendering popup menu to document.body when Menu is mounted.

@benjycui

This comment has been minimized.

Contributor

benjycui commented Nov 16, 2017

We can just force submenu render after componentDidMount, for Menu is based on rc-trigger which are not able to render nodes before componentDidMount.

It's good enough for something like Google which will run javascript before analyse DOM.

--

Edit: it means that we will not render submenu in SSR.

@yesmeck

This comment has been minimized.

Member

yesmeck commented Nov 24, 2017

A new prop called forceSubMenuRender will be added in antd@3.

@yesmeck yesmeck closed this Nov 24, 2017

@useless-stuff

This comment has been minimized.

useless-stuff commented Nov 24, 2017

Thank you! 👍

@Stephen920611

This comment has been minimized.

Stephen920611 commented Dec 10, 2017

我想问一下,现在3.0 子菜单如何更改样式啊,为何查看不到dom元素了

@yesmeck

This comment has been minimized.

Member

yesmeck commented Dec 10, 2017

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