Personal recent interview situation
Since February this year, all my interviews have been shot except one yonyou, which can be said to be very cruel. There are a lot of their own feel still good post, such as Baidu, with who learn, good future and other companies. To be honest, it was a big blow.
Basically, the situation began to get better from March. At this time, the epidemic may be almost over, and the country also started the infrastructure construction plan of nearly 40 trillion yuan. At this time, several representative companies interviewed, including Tencent, Ele. me, Babytree, Kuangshi Technology and so on, were basically successful.
Finally, on March 9, ELE. me just confirmed the position of P7 for me. Also calculate oneself to another stage of struggle. Make an interview summary of your experience.
My preparation for the interview
In fact, I belong to the process of preparing for the interview at the same time, but in any case, I must have a solid foundation, a good self-introduction, and describe my career story.
1. Preparation of basic knowledge
This part, in fact, is very important. Many problems must be easily understood, as natural as breathing.
Because the degree of mastery in this area determines whether a front end engineer can reach an advanced level.
Starting with things like object-oriented, prototype chains, closures, ES6, HTML5, AND CSS3, they are the foundation of the front end and need to be understood by heart. For example, even closures do not understand the explanation, really should work hard on these foundations.
For the front-end framework, basic features, life cycles, components, value transfer interactions, routing, REdux, VUex, etc., there is little confusion. For example, the interviewer may ask, what’s the difference between actions and mutations, or something like that.
This piece, can ask the question is almost infinite, even if the same knowledge point, ask the method is not the same, do not really understand the words, it is really can not pass the advanced that one.
2. Good self-introduction
A lot of people don’t do a good job of introducing themselves, which is actually the interviewer’s first impression of the interviewer.
If I were an interviewer, I would probably get this from my introduction:
1. Is this person logical?
2. Does this person have a positive personality or a slight inferiority complex?
3. Does this person express themselves well?
These are important questions, the thinking goes, and you can do the opposite.
1. School and major
2. Technology stack
3. Career History
4. A recent company contribution
Do not tell the interviewer, and the product, backstage good cooperation, complete the company’s project and so on. Because it’s total crap!
A self-introduction usually lasts about two minutes. Are you sure you can explain the above four questions to the interviewer in two minutes? For example, I am good at React, have done XXX optimization and have XX years of project experience.
The essence of self-introduction: In the shortest possible sentence, tell the interviewer your strengths and put you in context. If you say you are familiar with VUE, the interviewer will probably ask more about vUE and will not react to you.
3. How to tell a story
This is an important point. It’s important that the story has something to it, something that shows how you’re different from everyone else.
For example, I would say that I was at the company, and I did standardization work on our front-end projects, building our internal component libraries, and integrating our own scaffolding tools.
This is where I think I’m different from most of the other front ends, and the interviewer’s focus is on, what is project standardization, what dimensions are defined? What problems have been solved by the construction of component library? What problem does scaffolding solve?
Any person is unique, and any project is different. It is important for us, as interviewees, to extract these key elements and form our own “story”.
For example, I undertook the company’s XXX project independently. What challenges did I face, how DID I thrive against the odds?
For example, I studied the architecture of how many projects through XXX channel.
You must believe, because of you, what has changed. In fact, most people are in a passive state, do not know their own use, their position in the team, what their responsibilities are. At work, I want everyone to believe that what they have is useful, and then look for the point where you can make a difference. If you’re looking for a job, think about what you’re really contributing to the team.
What to pay attention to in an interview
What is the core of the interview? Always remember, that’s communication! In fact, the biggest difficulty for us to do technology is mostly communication, at least for myself, I have this problem.
The meaning of communication, on the one hand, is that you want to make others understand what you say; On the other hand, you need to understand what others are saying.
Talk to pay attention to, let others understand you
For example, WHEN I was interviewing Meituan, I kept stuttering. In fact, I don’t know why. I usually speak normally, but on special occasions, this problem would occur. It was a video interview at home, and my roommate, embarrassed to speak directly to me, recorded it for me. I listened to it for about 10 minutes, which was not satisfactory.
I listened to the 10-minute recording, and my own assessment was that it was hard to talk, but it didn’t kill me to work together in the future.
In all of my interviews, I’ve changed my focus from how I speak to how I make myself understood.
First, everything I say to the interviewer is systematic.
Second, everything I said to the interviewer was logical and clear.
Third, everything I say to interviewers, I pause for at least two seconds to think clearly before speaking.
Of course, this one may be my personal exception, but the basic statement is smooth, logical, in programmers, do not have much.
Learn to listen, let you understand others
In many cases, in fact, when the interviewer is expressing, it is likely that we do not understand the meaning of the interviewer, this time, will be particularly awkward.
What I usually do is say, let me describe the problem you just mentioned as XXXXXXX. After you describe it, ask the interviewer, is that what you mean? Generally speaking, the interviewer will give more detailed examples and descriptions.
When I was hungry? The interview, two to the interviewer, asked a business from the start is more complex, so in the beginning, I really don’t understand, but the interviewer said what, but I in his own way, to guide the interviewer said more, and then to a certain extent, to reach a consensus, this is a more pleasant communication.
Whether learn to speak, or learn to listen, in fact, the core problem is to let both sides of the communication, in a channel, because for leadership, interview interview, in fact, is to find the same kind of people!
Must-know interview questions
Front-end some core classic problems, feeling will never be out of date, anyway, I personally encountered a very high frequency, but I will not read these problems in detail, just do a piece of advice.
1. What happens when the front-end browser enters the URL?
A normal front end would answer, DNS parsing, HTML file fetching, DOM parsing, page rendering, and so on.
In fact, the process is very complex, such as a DNS resolution stage, which steps is it divided into? Are the resolved IP addresses necessarily the same? Is DNS resolution done every time? You may also need to understand some issues with CDN hosting.
Like HTML file retrieval, how is it transferred? How is the link made? What are three handshakes, four waves? What is the HTTP protocol port? Why can I directly access an HTML file?
.
2. Front-end performance optimization?
Most of the front ends basically say, reduce HTTP requests, compress and merge JS and CSS, image lazy loading techniques, prevent backflow and redraw, CSS in the head, JS in the bottom.
Is that true? Exactly! But in this process, I feel a lack of thinking.
For example, to reduce HTTP requests, what dimensions can be reduced? Like merging HTTP requests? Like merging resources? Like lazy loading of images? Are there other dimensions of HTTP optimizations? Cookie optimization? Optimization of HTTP requests and resource loads? What about in a WebView? And ordinary browser optimization techniques, and what is the difference?
.
3. How to perform performance monitoring and abnormal monitoring at the front end?
Performance monitoring, anomaly monitoring, basically in small companies, there is no practical basis, but in almost large factories, they will pay attention to this problem.
The first is performance monitoring, which should be in several dimensions: one is the HTTP aspect, the back-end log, flow into Kafka, and then consume data in Kafka, can monitor exactly which interfaces are abnormal? What is the anomaly rate? Another aspect is the front-end Performance API, which generates data during the user’s real-time use, thus enabling page Performance monitoring.
Front-end abnormal monitoring, first of all to understand what is abnormal, HTML, CSS these things, is nothing more than a display of the problem, not to let the page white screen things happen, the so-called abnormal monitoring, in fact, is js abnormal monitoring. On the front end, window. onError is a listening event for js exceptions. And remember, it’s not supported in IE, so you’re going to have to use try catch for IE monitoring, and we’re probably going to have to notice, for example, how to do try catch for asynchrony.
The last one is the front-end SDK buried point, directly develop a JS file, statistics user UV/PV analysis and so on, such as user conversion rate and so on, this piece of personal do not have any special practice, you can look at the online Baidu.
4. Front-end security
This is a must-ask question for advanced front-end systems, referring to a front-end’s perception of the overall front-end security.
We must understand several aspects: SQL injection, XSS, CSRF, cookie security, password security, and so on.
SQL injection, to understand the SQL injection scenario, what is its principle, what is the current database solution?
XSS attack, common attack scenarios, what types of websites are vulnerable to XSS attack, and what is the principle of the whole process?
A CSRF attack is a phishing site. Understand why it is attacked and what strategies should be adopted to defend against it.
Cookie security, to understand why token is used, advantages, etc.
Password security, mainly user login, user data submission, encryption, into the database of a whole process.
Secondly, there is the issue of HTTP and HTTPS and so on.
5, HTTP, HTTPS, HTTP1.0, 1.1, 2.0, 3.0 differences
HTTP, in fact, is a very complex system, there are a lot of things to dig into.
How does HTTP do asymmetric encryption to get HTTPS? What is a CA certificate? What is the verification process for the whole site?
What are the differences between versions of HTTP? What problems have been solved? For example, head reduction optimization, do you know the specific strategy of this optimization? What has been reduced? What has been added? Dig deep for details.
The underlying protocol of HTTP? TCP/IP protocol three handshake, four wave, how is the specific communication? What is full boot? Even extending to the entire network protocol realm, what is a socket? What is UDP for? DNS? The FTP? And other protocols that are not commonly used?
If you extend it, seven layers of computer networks? What does each layer do? How computers are made, how we parse our code, and so on.
.
The depth of the interpretation
This part, I roughly divided into several modules, source code, visualization, cross-platform, engineering, mixed APP interaction, design mode, in fact, each is worth front-end research.
As an individual, in fact, I also set several directions, their own future efforts.
1, the source
It is best to read the source code of a framework, the worst, but also read the source code of others to interpret the article, the current trend is basically react, vue.
In the case of VUE, you have to understand the entire cycle of the VUE framework, such as vUE initialization, what happens? How does vue template parsing work? How is AST formed? Render function generation? What is dependency collection? What is patch? Data update strategy and so on.
You also need to understand how mixins, $options, vuex, router can each implement their own functions through these apis.
The source dimension can be tried from vue architecture, react architecture, loadash, Zepto libraries, because we are from these frameworks and JS library, come.
2. Visualization
Maps, EChats, Canvas, webGL, d3.js, three.js!
Above are the topics about visualization that I want to study. Although visualization is not my specialty, I have worked in a map-related company before, so I have gained some insight into visualization. During the interview with Ele. me, a special application scenario was mentioned, that is, the route drawing of maps, the push of large quantities of data, and performance-related problems.
In the future, common front-end skills, such as VUE, React and so on, will be familiar to everyone. There is no differentiated competition, and the front-end market is becoming saturated, which requires more specialized talents in some aspects.
3. Cross-platform
Flutter, react-native, Weex, electron
These are some of the cross-platform solutions currently on the market, and each framework, in general direction, addresses some degree of multi-terminal development capability.
First of all, we need to understand that multi-terminal development is not a panacea, there are some pain points in our development, whether RN, or WEEX, are to provide some special components for the front end, to achieve development capabilities. But the business is diverse, needs are also changing, for the components, or apis, we front-end developers, some functions are not able to implement.
For multi-terminal frameworks, it’s even more important to understand the layers, like Electron, to understand its essence, which is to use Node to shape a container for a desktop application with a WebView inside.
From the point of view of the interview, the interviewer is not paying attention to the problem of how to use this thing, will generally ask some internal principles, such as the comparison of small procedures and public number? The underlying implementation? For example, what is the compilation and parsing of RN? How to compile JS into a real ios and Android app. For example, how is the rendering mechanism of Flutter different from that of RN? How is it different from a regular Web page?
Flutter is a cross-platform technology that has become quite popular recently. From a job hunting perspective, flutter can actually be learned. The electron desktop application itself is not difficult, but learned and not learned, in fact, is a difference.
4. Engineering
Engineering is a direction in which I am interested. I have also done some practice, but it can only be said that the tip of the iceberg in engineering.
Throw out a few points we can talk about.
1. Front-end project standards?
Manifests as library choice? What are the rules for dividing files into directories? PC, mobile multi-terminal practice? SSR solution integration?
Component library integration?
What is the purpose of component library construction? NPM package release?
3. Scaffold tools?
Webpack build optimization? Webpack build optimization? Self scaffold tool use?
4, git commit specification commit- MSG? Code inspection specification ESLint?
5. Front-end performance monitoring? Front-end abnormal monitoring? Front-end user buried point SDK?
6, rap? Jenkins?
5. Mixed APP interaction
JsBridge, performance enhancement aspects, X5 kernel
How does jsBridge interact with h5 native applications?
Interactive communication between ios and H5? window.webkit? Is it synchronized?
Interaction between Android and H5? How are the details different from ios?
What can webView do to improve performance? What is an offline package?
What are the advantages of Tencent X5 kernel? What problems can we avoid by using the X5 kernel?
6. Design patterns
Finally, let’s talk about design patterns, which is a very common interview question.
At a minimum, we need to know the functionality, code implementation, and usage scenarios of the following design patterns.
Singleton pattern, prototype pattern, factory pattern, observer pattern, policy pattern, proxy pattern, etc.
Finally, I wish you all a pleasant interview.