On May 7th, “Tencent SNG & MSUP Technology Open Day” was held in Shenzhen. One Hundred Cases interviewed some of the lecturers in attendance about what they will share at the conference. This interview is Tencent cloud platform product technology director Chen Zishun.

One hundred Case: First of all, I would like to ask you to introduce your current work and the field you focus on

Chen Zishun: I am currently working in Tencent Cloud team, responsible for the management of platform product line, including front-end team and team capacity building. From a technology perspective, I’m paying more attention to the development of the front end, including some trends in the front end and potential new technologies in the future.

The front-end used to be misunderstood as “making web pages” and “cutting graphics”, but as the front-end technology continues to evolve, we can also see that the front-end technology is one of the fastest growing technologies. Frameworks like AngularJS and React keep emerging. How do you see the trend of front-end development moving from simple Web development to rich Web application development?

Mr. Chen: I agree with the statement that the front end is developing fast, but I should also note that the front end technology is relatively late. Since 2004, when Google came out with Gmail and proposed Ajax, people have realized that this technology can actually solve a lot of problems. But if you look back, some of the development of terminals, including the development of the entire computer field, actually to the client side, this path has been going for a long time.

The front end is a bit late. Now it’s “I’m going to make components”, “I’m going to make AngularJS”, “I’m going to make Router from the front end”, “I’m going to make two-way binding”, etc. React provides a component management approach. In fact, these concepts are not new. In client development, these concepts have always existed, but the front end is basically aligned with the current trend of the development path of the client. Now, if you want to see where the front end is going, I think you can look more at the path of the client side.

One Hundred case: Qzone business With the development of the Internet, the growth of the number of users, after several technological upgrades, can you talk about the story behind these upgrades from the front end of qzone?

Chen Zishun: The first stage is my work in Qzone. What is the most important work in this stage? At that time, we faced the step of 100,000 users online at the same time, and we had high requirements for the backend load.

Therefore, our main work at that time was: how can we first hold the stage of rapid growth of users, to reduce the load pressure to the background. Because the front end development mode in 2006 is the way of background homepage, we found that if we follow this way, the background pressure is very big, and the background at that time is not as good as the hardware conditions now. We had a three-person front end team, and we were thinking of all kinds of ways to take the pressure off the back end.

So how do we do that? We put some logic code on the front end, and there are some Ajax technologies that we can innovate with, and we can move a lot of things to the front end in this asynchronous way. We were also thinking more about how to reduce requests in the background, such as file merging, preloading, etc., which were actually a lot of things that we had in mind in the architecture at the time.

Of course, there is also the problem of too many background requests, not only page requests, but also including too many background CGI, because the space is divided into many modules: personal center, blog, message, avatar and other information on behalf of the corresponding service behind.

In terms of architecture, I was thinking about how to deploy a unified environment on the back end to coordinate with the background, and how to know which module data is updated according to the way of labeled area class and then pull dynamically. This logic was a little too “heavy” on the front end at the time, but it was a hallmark that got us through the rapid user growth of 2006-2007.

In the second phase we found that the front end was getting heavier and heavier. There were a lot of historical issues with the front-end code at the time, so we didn’t change it much. We decided that it would take a long time to rewrite the spatial code, and the amount of code that needed to be rewritten was huge at the time.

In particular, in order to minimize requests, a lot of the logical layer code was split into very small files. So in the process of refactoring, we also introduced some modular management methods.

Frankly, modularity was introduced earlier than today, but it’s a shame we didn’t export these tools. For example, we wrote some tools internally to split the file and make the directory more reasonable; There are also tools that automate merging and compress programs; An automated approach was adopted to ensure that our code was managed and deployed. The second stage I think is very important is how we modularize the code.

The third stage is when the team gets bigger, from a few people to a dozen. So how do you do that? At this time, the product has higher and higher requirements for the front end, requiring you to achieve more and more functions, and more and more cross-team cooperation. In my conclusion, I should have experienced a process called technical standardization and standardization.

Before the code has been managed, the module has been done, how to improve efficiency, how to make the code after submission will not produce obvious errors.

We had a lot of challenges, like browser compatibility. There were a lot of browsers available at the time, like Firefox and Chorme, and we spent a lot of time testing browsers, but it didn’t meet the requirements. We thought, we have to have a standard component on our team, a standard framework for browser compatibility.

At that stage, there weren’t many frameworks out there that could be written, so we decided to write it ourselves. Why write it yourself? Tencent still likes to build its own wheels, so I made such a standard framework for the team later, and we called it QZFL internally to achieve standardization.

It took a long time for the framework to evolve from 1.0 to 2.0, and it also solved the problems in the development process. For example, I no longer need to focus on the implementation of some common front-end components, the implementation of some functions, just focus on the business logic.

In terms of technical standardization, we have introduced monitoring. After the introduction of monitoring, we can master the environment of the whole network and the customers at the front end. Through monitoring, I know the performance of the front end and the success rate of each request. Monitoring development has expanded to many new dimensions, for example, I know which province users are slow; Which carrier’s network is slow; What is the approximate percentage of users who are slow right now and so on.

These data can help us to continuously improve the overall space operation level, operation capacity. I think this is a very important sign that we have come to an industrial level. This is one of the things that I think the space is mature now.

One Hundred case: Qzone related technology has been very mature, what challenges will be encountered in the future?

Chen Zishun: Qzone is relatively stable now, and IT is hard for me to judge what technical difficulties I will encounter in the future. I think the real challenge is whether it can cope with the changing needs of users today, and it’s hard to say that any one technical challenge is a challenge. However, I think what Qzone needs to deal with more is the change of end users’ habits. Can the technology be updated in time to solve users’ problems? A lot of what we do is still product-oriented, and we should consider solving specific product problems through technical means.

The space is now relatively mature, which is also a good opportunity for our team. Because the customer traffic is still very high, which is now popular mass services. The feature of mass services is that every time you do something, your judgment affects the use of a large number of users. So there’s a lot of demand on programmers, and everything has to be thought through very clearly to validate implementation.

In fact, QQ space to go up to now, still doing a lot of very cutting-edge attempts. , for example, want to try HTTP2, monitoring of the space in addition to this area before we speak, operator performance monitoring, data of their own dyeing, data acquisition, and so on these ability are also doing more and more deep, at the same time, the space of front end components from the browser to access layer is a set of complete solution, this is a manifestation of the QQ space is mature.

One hk case: front end it is very important to optimize the work of a module, on some BBS to optimize there are a lot of controversy, recently there are users in QQ space to open the home page is loaded on zhihu 100 + JS, ask questions, what do you think on this optimization standard, digital to measure these standards will be?

Chen Zishun: In fact, we pursue the ultimate optimization goal of the measurement standard is unique, but the program will be diversified with the business options. In fact, the space has been doing optimization, our approach to the extreme may be different from the common understanding of many people.

We prefer to keep trying something new and coming up with hypotheses. I think the front-end optimization method, have a certain timeliness and applicability. It’s not that loading a hundred files is good or bad, but we’re not denying that loading a hundred files right now is not good. It could be team management, or some other technical reason. And at the end of the day, we actually have to come up with data to measure.

For example, even if you load 100 files, have you ever thought that the 100 files might not make the user’s page open slowly, but that there is a way to make him feel fast? If more than 100 files are not loaded at the time of your first screen display, support the first screen file to control, the rest of the asynchronous request, the number of files does not affect your business too much.

So our judgment is how users see performance, how quickly they can get what they want when they use it, and that’s all based on the fact that we have solid data analysis. Constantly put forward assumptions, design schemes, more targeted optimization of some places, for some common problems of users, take out the argument, verification, and then adopt or overturn the previous assumptions.

You might think that loading 100 files is a problem, but based on our data, it probably doesn’t really affect the user experience. In a nutshell, it’s like we’ve been talking about optimizations, merging. After several architecture upgrades, we found some files that we had closed and taken apart, closed and taken apart, closed and taken apart. This is because we are constantly adjusting as our customers’ networks and hardware change. There is no final standard according to which optimization can be achieved once and for all.

One hundred cases: When it comes to Web optimization, many companies have put forward some golden rules, such as Yahoo. What do you think of these rules? Has Tencent summarized something similar internally?

Mr. Chen: Our perspective on technology summary may be different from other companies. I also talked about some principles of optimization before. Our optimization concept is actually similar to the concept of “growth hackers” abroad, which is the process of putting forward hypotheses, designing schemes, analyzing data, verifying and overturning hypotheses.

We don’t think standard things can be universal, so we haven’t put out some gold standards. For example, Facebook doesn’t provide any standards, but after sharing Bigpipe with us, the shader finally said, “The optimizations I’m making are probably only for Facebook, not for everyone.”

In my opinion, the golden rule is to tell you how to do it, but not why you think the way you do it, and a lot of the optimization theory at Yahoo has some inadequacies. Even more directly, if HTTP/2 were to take off, basically yahoo’s golden rule of optimization would be broken, so would you still use it?

So optimization is constantly evolving, and as I mentioned earlier, front-end optimization has a certain timeliness and applicability. This will have higher requirements for front-end development, must be a thinking programmer, to put forward more assumptions, and know how to demonstrate.

So in tencent we don’t see who took what laws and to judge the person can reach the level of senior engineer, but by his thought process, logic thinking, in solving this problem, your thinking is logical in this way, you find the innovation points, more beautiful to solve the performance of a specific optimization problems.

One hundred case: front-end performance optimization for ordinary users is actually he opened the web page faster, but in fact behind this fast is a lot of technical work can be done.

Mr. Chen: Yes, what is our performance optimization goal? I made that very clear just to be quick. And what is the goal of fast? For example, my page open time is 1 second, we spent a lot of time for this 1 second open, not only front-end compression, not only front-end file merge, I will use some cache, some network delay I use in business means, technology to make the page open faster. In fact, there are a lot of problems in front of us.

In addition, with the development, now the front end is getting heavier and heavier, is the USER CPU consumption, is there a way to control the CPU? I monitored the real-time situation of CPU to ensure that the first screen rendering content would get CPU resources first. Some heavy resources can be delayed rendering, so as not to affect the opening of users. Therefore, we also tried to improve performance by controlling CPU resources.

We’re also thinking about whether we can go deeper into rendering. We’re going to look at the browser kernel, think about rendering, and have a lot of conversations with our X5 team, the browser team. You’ll find that the whole front-end optimization to the end is more about how to find problems, including pushing the various actors in the technical process to solve most things.

However, a lot of front-end development nowadays, most think that as long as the use of the xyz principle, the xyz rule to complete the performance optimization of this thing. But what he didn’t expect was that there would be a lot of groundwork underneath the whole page opening process. These include javascript issues that open the page, page requests, backend performance, what happens to the browser, all of which can be your optimization points. Performance optimization is an ongoing technical operation.

The most difficult part is how you can find some possible optimizations from each link, put forward the hypothesis, and lead the team to work with everyone to solve the optimization problem, which is what program engineers often do.

One hundred case: When it comes to leading a team, you have experienced the evolution of a team from 3 to dozens of people, and also become a manager. Do you have some good management experience to share with everyone in the process of the team growing from small to large?

Chen Zishun: I lead a lot of teams. Before Cloud, I basically led new teams. I just had a few people there.

Next, when the team size is slightly larger, we need to build some management parts to help the team run effectively, how to manage the workflow, development mode, including the way of cooperation between teams, process construction, etc.

To a larger team size, more demanding, depending on the standards you put forward for the team. For example, code specification, engineering management, better management methods and tools have been introduced to help the team achieve the goals more effectively.

I think this is the whole management process, just like the formation and running-in stages of a team in our management method, as well as the standardization stage of the team itself, and finally the team performance is basically done in this way of thinking.

One hundred case: There must be a lot of new people in your team, with the front end hot, there are also a lot of people want to do the front end, for these new friends, as a front-end predecessor with ten years of experience, what advice would you give them?

Chen Zishun: Front-end is as easy to get started as before, but the challenge of this technology is also too easy to get started, leading to many people who are not programmers to do front-end. If you really like to do front-end, want to become a qualified front-end development, first of all to be a qualified programmer, and a good programmer has some requirements:

The first is the computer foundation, master some network algorithms, for programmers this is the foundation, whether you are the front end or background, or, these are very important, this is the computer basic ability.

Second, programmers constantly challenge new problems and improve their code during the coding process. At the same time, a good programmer doesn’t leave a hole for the next generation, he thinks about the applicability of the code, which is a universal quality he thinks about well.

Third, programmers should have rigorous thinking logic. To do anything and make any decision, we need data to prove. We don’t guess and don’t easily believe some golden rule or advice from outside. Programmers who know how to think backwards through a problem, why they ask such a problem, often have such a rebellious idea.

In addition, programmers need to be curious about new technology, not just what technology I’m using, but why it’s designed the way it is, and what problems it ultimately solves. I think good programmers think a lot about that.

If you think you can do that, then you go to the front end and do more, then you’re a good front end programmer, not just a front end developer.

One Hundred case: In the process of growing from a newcomer to a manager, especially having experienced many different businesses, how did you learn in the fast-changing environment and quickly integrate into the new business?

Mr. Chen: ACTUALLY, I have done a lot of business in Tencent, from Qzone to value-added products to the cloud business. I am also learning constantly in this process. Before I do any business, I first need to understand what the business is about and what changes the business will require in my skills.

In the process of transition from PC to mobile terminal, we should embrace H5 and similar development capabilities, so that we can also learn this knowledge to ensure that we can meet business requirements and help business solve problems.

Now do cloud, found that do cloud narrow front-end (only write JS) requirements are not as high as QQ space, but programmers thinking logic, as well as the full stack requirements will be higher, because you first have to re-understand the cloud business, re-understand the business user is who, cloud users actually correspond to the majority of developers; What kind of help do developers need from you, what kind of support can your product give them, and how can you do it better?

Then I will think about whether my team’s current skills can be satisfied. My team needs to make changes, try more, and even think about the difficulties of these developers at a broader level.

So my team basically shifted into the role of full stack engineers. Once we get to the cloud, we need a more comprehensive knowledge. We need to build ourselves into a full stack engineer, from front-end JS to back-end NodeJS capabilities, including all aspects of the network, to have a very comprehensive grasp, you can create products to solve more customers’ problems.

In my opinion, the way I learn business is to consider how to adjust and transform my technology based on the needs of customers.

One hundred case: Tencent how to look at the front end, from the company level will we develop capacity model?

Chen Zishun: I happen to be the person in charge of Tencent’s front-end channel. In fact, we updated the standard of the channel last year, and the earliest promotion channel is still focused on front-end JS. How do you solve problems, how do you optimize performance, how do you do sustainable business operations, these are the requirements of the front-end channel. But because the market is growing so fast, we’ve done some splits. What’s the split?

First, the front-end direction of the game. The emphasis of the game is to have faster learning ability, learning requirements, because the game technology is changing very fast, there are many new game frameworks and engines, including H5 itself has a lot of game schemes, can you learn quickly. The game also has some new requirements, such as security requirements, because there will be a lot of people writing plug-ins, so security requirements are also part of this direction to look at. Second, the end direction of the front end. The requirements for this direction will be different from normal front-end development, because it will have to cross over, first with an understanding of the capabilities of the H5, and also with some knowledge of Native terminals. This can better solve the user’s problems, so there will be some bias.

Third, full stack engineer, we internally call full end engineer, which means we put node.js and PHP in. Why do we think this is the front end? Because in terms of the “last mile” of the user’s access to the page, when the user opens the browser and outputs content to the browser page, these things should be covered by the front end. The technology of outputting pages, we usually call it access layer, or access Web services, access Web services where we have some say in the front end, and we can control it, and we can develop our business on top of it, which also reduces the cost of working with the backend development.

At the same time, we are making new optimization, including more controllable business logic, unlike in the previous space, for example, when we want to do an optimization, it is actually very difficult to push the background, because everyone may have different rhythm, and he may not understand why you want to do so. So we came up with a third concept called full stack Engineer, which is a popular concept in the industry.

Fourthly, Tencent has a more special field called experience engineer, which is also a professional front-end team. So right now we have four directions in the channel to cover the whole company and the whole team and what they’re doing. And each direction is also developed by senior engineers of new specific requirements, to help everyone continue to grow and keep up with the industry’s requirements for their own capabilities.

One hundred case: What do you think of the full stack?

Mr. Chen: I think full stack engineer is this way, or to go back to the problem of programmer, programmer should not be a job selection role, many technologies should be interested in. If you think that learning more languages and crossing boundaries means you are a full stack engineer, you may have a narrower understanding of the full stack.

The concept of a really good full stack engineer involves a very thorough understanding of the technology covered, the business, and the various roles. For a full stack engineer, his biggest characteristic is that he can accept changes, and when he meets changes, he can quickly change and solve specific problems. Of course, he must have certain depth, which is a better full stack.

From my itself, although I myself also said the whole stack, I have come in contact with all sorts of technology, including the background, including Java, basically studied again, of course I can’t say all has very deep understanding, but there is one thing that I am able to understand, other things that you asked me to do I can also go to complete, is essentially a resilient programmer.

We all know that foreign famous IT companies, like full stack engineer, is simply a programmer should not take a language himself to death, actually this is now in the domestic many programmers a terrible idea, you put too much on the level of language, the language as a tool, his inside out, from the role of using this tool Let oneself be able to touch and embrace the change of this industry, let oneself be able to open up more in the way of thinking.

100 cases: Facebook is behind React, Google is behind AngularJs, and there seems to be no strong Chinese power involved. What do you think of China’s future front-end development, including some open source power, and is it possible that there will be Chinese companies doing similar things in the future?

Mr. Chen: The failure to come up with a framework does not mean that Chinese programmers are not competent enough, but whether there are enough management mechanisms and methods to encourage these programmers, so that they can continue to improve, or continue to devote themselves to this matter.

As far as I am concerned, many Domestic Internet companies are still in the stage of aggressive expansion, and both business orientation and operation orientation require programmers to solve a large number of immediate problems. In fact, a good open source component is not only you do, the most important thing is that you can maintain the community, can you maintain the heat of this component. The inability to continuously output updates and keep iterating is one of the difficulties encountered by most domestic front-end frameworks and components.

If this problem can be solved, I believe that China will come up with some pretty good frameworks for more people to use. As far as I know, many domestic teams that used to provide front-end standards for companies have been gradually separated. I also hope that one day domestic companies can make some adjustments and have a special team to provide and design such technical capabilities for the industry.

But the atmosphere for such technology may not be as good at home as abroad. I asked the React team why Facebook would encourage them to do something like this, and they said something that I found interesting: open-source React would solve their recruiting problems.

A Hundred Cases: Open Source React to solve recruitment problems?

Chen zishoon: React has been incubating for a long time inside Facebook, and even stopped updating for a while. Later, it was reformed and launched by aspiring programmers. In fact, through this case we can see that doing open source framework needs long-term investment. React is so good that more developers can use it, and they must know React. After hiring, the cost of talent cultivation will be reduced. Meanwhile, many people will come here and think React was launched by Facebook, so I would like to join this team and work with them. This has also formed a certain atmosphere of talent recruitment.

This article is transferred from the “One Hundred Cases” public account, the original link