I understand there are two approaches to create a page that is compatible with both lightning and classic

  1. Create a lightning component and use lightning out to render it on a visualforce page
  2. Create a vf page following the lightning design system and manage navigation for the lightning and classic UI's

I need to override the standard 'view' layout with a custom page that is compatible with both UI's. Is approach 2 a simpler approach to achieve this? Also, in general, what are the pros and cons of these two approaches of creating custom pages compatible with both UI's?

2 Answers 2


Both approaches are okay but I would prefer #1. That way you would be able to use some standard lightning components, preferably input tags, in the custom components that you are using that might make your work easier.

While using the lightning component in your VF Page, you wont be able to use any standard lightning actions such as force:showToast etc. as they are not supported in VF page but they are supported in lightning components that are directly rendered(without a VF page being the container) in the lightning experience. This goes with both the above approaches because you'll be overriding a button with a VF page and it will reflect the same in both Classic and LEX.


  1. If the object layout changes, you'll have to add the fields to the page. This means changes to the client side and server side code(probably) whenever the layout changes.
  2. If you have multiple record types for the object and the layout is different for each record type, I believe you'll have to show the fields regarding the layouts which is what you'll need to handle.
  • Thank you Mohit! The project timeline is tight and I do not have prior knowledge in lightning components. Would you suggest VF + SLDS approach for someone who is good at VF development? Are there any major issues if I go with this approach?
    – user4061
    Dec 4, 2017 at 7:52
  • In that case you might go with VF + SLDS. There might be some issues regarding CSS. Sometimes there are differences in the CSS when the page is rendered in Classic as opposed to being in rendered in LEX. Other than that you are good to go and I don't think there are going to be major issues. Dec 5, 2017 at 11:28

Two factors to consider are:

  • Which technology stack you are stronger in. The learning curve to move from Visualforce to Lightning Components is pretty big, so if you already know Visualforce you will be able to deliver Visualforce much more quickly/cheaply. Getting the styling (more or less) right is now pretty simple given the new lightningStylesheets apex:page attribute.
  • How much you want to start moving to Lightning Components. That is, this might be a good opportunity to start climbing that learning curve ready for future Lightning Component work.
  • The new lightningStylesheets=true attribute is messy to be honest, and it's not very well-defined in documentation what to do when you want to tweak how that "Lightnish" rendering looks.
    – Charles T
    Dec 3, 2017 at 22:07
  • Keith, thank you very much for your inputs! I would definitely want to learn development using lightning components but as the project deadline is tight, I do not think I can spend much time on the learning. How much time could it take for someone with good visualforce skills and basic javascript knowledge to be strong at lightning components?
    – user4061
    Dec 4, 2017 at 7:41
  • Thank you Charles! The focus is more on the functionality than the design. Compromising slightly with the design would be acceptable. With this in mind, would Visualforce + SLDS be a faster/simpler approach?
    – user4061
    Dec 4, 2017 at 7:47
  • @user4061 To be "strong" will certainly take multiple weeks.
    – Keith C
    Dec 4, 2017 at 9:32

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .