• State of Frontend 2020 Report – Frontend Development trends by tsh.io
  • Authors: The Software House, Vercel, DAZN, Honeyspot, Onely
  • The Nuggets translation Project
  • Permanent link to this article: github.com/xitu/Annual…
  • Translator: Hoarfroster
  • Proofread by: LSvih, HumanBeingXenon, Usualminds

Click here to view =>directory

Click here to view PDF =>Fly books – State – of – Frontend – 2020 – by – TSH. PDF

5. Micro Frontends

It’s early days and there’s still a lot to learn, but I’m confident that the micro front end will continue to evolve and mature, just as microservices have

To be honest, it’s exciting to see people today embrace microfront-end architecture so enthusiastically! We’ve known for a long time that many companies around the world are using microfront-end architectures, such as American Express, DAZN, IKEA, Spotify, and Starbucks. Now that we have front-end state survey data, we know that a quarter of front-end developers have used microfront-end services.

I think Web components are a great, entry-level solution — especially for people just starting their micro front-end development journey, and our survey results seem to confirm that. Another way to think about it, there are frameworks that support server-side rendering, such as Holocron, Podium, and Ara Framework, as well as client-side assembly (such as Module Feration or Single SPA). However, you should keep in mind that while these frameworks are a good complement to the micro-front-end community, you should pick and choose carefully, depending on your actual needs.

To my delight, only 20% of respondents agreed with the statement that the micro front end would be gone in three years (see Chapter V11, the Future of the front End). I also believe that the future is going to be about the micro front end — they’re going to make the micro front end grow and mature, just like microservices did in the last few years. In fact, TC 39 is already making some interesting moves, with Realms projects already in Stage 2, which will open up new scenarios for the micro front end.

The micro front end is not a panacea, but it is certainly a nice complement to other architectures such as server-side rendering, JAMStack, and single-web applications. But because it’s so early, we still have a lot to do, and we need to apply more and find more to learn. However, I am a firm believer that this architecture can be beneficial for adapting projects and teams, as long as it is used in the right context.

Have you used microfront-end services?

How do you combine your micro front-end services?

6. Search engine optimization SEO

When you understand Google’s point of view, building a user-centric and machine-friendly site isn’t hard at all

Traffic from search engines is critical to any online business. According to Wolfgang Digital’s KPI Report 2020, original searches generate about 43% of traffic, much more than direct and paid search traffic combined. Similarly, according to our Front-end State 2020 survey, about 52% of developers don’t care about SEO.

I’m not blaming them here, but I suspect that some of you develop confidential internal applications that don’t need or even can be visible on search engines. However, in other cases, if you want a site to successfully display perfectly on Google, you need to do search engine optimization.

Because SEO experts don’t often use the developer’s language, SEO can be difficult to implement. Please allow me to help you – first, you should always make sure Google renders your JavaScript correctly, for example, you may accidentally deny search engine access to part of the script pair (in robots.txt), Or using JavaScript is not acceptable to Googlebot. I recommend you use mobile-friendly testing or URL detection tools – they are free, easy to use tools developed by Google. By using them, detect the DOM to ensure that all your important parts are rendered correctly by Google.

Also, according to survey data, more than 11% of developers use dynamic rendering (essentially returning a particular static page by determining if it’s a search engine crawler). Google calls it a solution for crawlers. This scheme is risky because dynamic rendering will fail in some cases, causing the raw traffic of these pages to drop to zero. Therefore, you always need to make sure that you have passed the tests and that the dynamic rendering works.

SEO is extremely important to most businesses, and rendering it is part of SEO’s job. You need to focus on using appropriate HTML tags and building a logical web page structure between your choice of server and client and dynamic rendering. When you understand Google’s point of view, it’s not hard at all to build a user-centric and machine-friendly site.

Do you care about SEO?

How do you achieve SEO?

  • This article is participating in the “Nuggets 2021 Spring Recruitment Campaign”, click to see the details of the campaign

If you find any mistakes in your translation or other areas that need to be improved, you are welcome to the Nuggets Translation Program to revise and PR your translation, and you can also get the corresponding reward points. The permanent link to this article at the beginning of this article is the MarkDown link to this article on GitHub.

The Nuggets Translation Project is a community that translates quality Internet technical articles from English sharing articles on nuggets. The content covers Android, iOS, front-end, back-end, blockchain, products, design, artificial intelligence and other fields. If you want to see more high-quality translation, please continue to pay attention to the Translation plan of Digging Gold, the official Weibo, Zhihu column.