Front-end interview experience (Byte, Didi, Huya), it is really difficult to tell the truth, the interview questions of front-end manufacturers have to look at the summary

The editor has sorted out the representative interview experience and interview questions of the small partners recently. I won't say much about their situation. Let's take a look at what problems they encountered in the interview.

byte

one side

  • At the beginning, I asked about my project, and it was very detailed.
  • How webpack improves build speed
  • What does the loader input produce what?
  • webpack principle
  • The principle of dynamic loading of webpack
  • webpack hot update
  • How to write a webpack plugin
  • Applications of AST
  • How to parse an html text, or test AST
  • Babel principle, how to write babel plugin
  • How to design a sandbox sandbox?
  • What does the API of the applet do to hide global variables? If it was you, how would you design it?
  • Multiple ideas for implementing color conversion 'rgb(255, 255, 255)' -> '#FFFFFF'.
  • Provide a number n, generate a set of integers from 0 to n-1, shuffle the order to form an array, shuffle it a few times, how can it look balanced, and name all the ways you can think of.

two sides

  • Business, business, or business, is there a better solution for project review?
  • How to handle a major accident bug
  • monitoring system
  • What's so good about virtual dom? Why does the framework design virtual dom?
  • The shortcomings of webpack, let you design a new build and packaging tool, how would you design it?
  • Online document editing, how to deal with conflicts between two people, how to present, consider various scenarios
  • Advanced handling of excel document conflicts, what about article conflicts? It is a deepening of the previous question.

Three sides

  • Algorithm problem: Find two numbers from the array [1, 5, 8, 10, 12] whose sum is 9, and return the result of [1, 8].
  • Algorithm problem: Find three numbers from the array [1, 5, 8, 10, 12] that sum to 19, and return the result of [1, 8, 10].
  • Algorithm Question: Given an unordered array of integers, find the length of the longest ascending subsequence in it.

Didi

one side

  • webpack principle
  • babel principle
  • Understanding of virtual DOM
  • How to do performance optimization in the project
  • Have you written a webpack loader or plugin?
  • Tell me about the babel plugin you wrote

two sides

  • The principle of redux
  • What is the difference between state management and publish-subscribe mode in redux
  • The principle of react-redux, how is it related to react
  • Do you understand the principle of multi-terminal?
  • The relationship between http and tcp
  • Can tcp establish multiple connections?
  • Explain why there are three handshakes and four waves
  • Have you ever written a babel plugin? for what? How to write a babel plugin
  • Do you know how to convert it into AST?
  • Have you looked into React's runtime?
  • career planning.

Three sides

  • Project Introduction
  • Tell us about the complexity of your project and how to solve it
  • How many business component libraries do you have and what kind of components
  • How the permission component is designed
  • Will you be a node?
  • Introduce your understanding of middleware
  • How to ensure the stability of back-end services and how to do disaster recovery
  • How to make database queries faster
  • What is the database used for?
  • why use mysql
  • What do you hope Didi can offer you?

four sides

  • Introduce the difficulties of the project and how to solve them
  • What technical advantages do you have?
  • What technology are you working on recently?
  • career planning
  • Have you ever done a mobile business?
  • How to arrange time when business is heavy?

Huya

one side

  • The difference between get and post of http
  • caching strategy
  • The handshake process of https
  • Features of http2
  • Difference between weak-Set, weak-Map and Set, Map
  • The difference between mvvm model and mvc model
  • How to implement an mvvm model
  • Why did you refactor saga with mobx and talk about the difference between the two
  • Talk about the understanding of vnode
  • Talk about performance optimization of webpack
  • Have written plugin
  • Do you understand the HMR implementation principle of webpack-dev-server?
  • Write about anti-shake and throttling

two sides

  • You have done live broadcast, can you introduce webRTC or the live broadcast solution you are using now?
  • Do you know about coding, can you explain the bit rate?
  • Do you know about coding, can you explain the bit rate?
  • Difference between RGB and YUV
  • Which live broadcast protocols have you learned about?
  • Do you know the difference between flv and mp4?
  • Knowledge of the MediaSource specification

Three sides

  • The difference between webSocket and ajax
  • Have you learned about xss and csrf and how to prevent it?
  • Have an understanding of React's fiber
  • Can you briefly describe the React implementation process?
  • Can you introduce the hook?
  • Scenario question, make a live barrage

The editor recently compiled a large factory interview questions, including: HTML and CSS, HTML5 and CSS3, JS basics, Ajax, popular frameworks, ten, Node.Js, front-end general questions, etc. For those who want to see the full version of the interview questions for front-end manufacturers (1), please click here to get it

1. HTML and CSS

  • Which browsers have you tested your pages on? What are the cores of these browsers?
  • There is a very important thing at the beginning of every HTML file, Doctype, do you know what this is for?
  • What is Quirks Mode? What is the difference between it and the Standards mode
  • What are the advantages of div+css layout over table layout?
  • What are the similarities and differences between img's alt and title? What is the difference between strong and em?
  • Can you describe the difference between progressive enhancement and graceful degradation
  • Why is it more efficient to use multiple domain names to store website resources?
  • Please share your understanding of web standards and the importance of standards-setting bodies.
  • Please describe the difference between cookies, sessionStorage and localStorage?
  • Briefly describe the difference between src and href.
  • What image formats do you know that are used in web page creation?
  • Do you know what microformats are? Talk about understanding. Should microformats be considered in frontend builds?
  • After the css/js code goes online, developers often optimize the performance. Starting from the user refreshing the web page, a js request usually has
  • There are a lot of pictures on a page (large e-commerce website), and the loading is very slow. What methods do you have to optimize the loading of these pictures to give users a better
  • How do you understand the semantics of HTML structure?
  • Talk about what needs to be considered when doing SEO from a front-end perspective?
  • Is there any way to style a DOM with its CSS?
  • What selectors are there in CSS?
  • What properties can be defined in CSS so that a DOM element is not displayed in the browser's visible range?
  • What is the problem that the hover style does not appear after the hyperlink is accessed? How to solve?
  • What is Css Hack? What are the hacks of ie6, 7, and 8?
  • Please write a simple slideshow effect page with Css
  • What is the specific difference between inline elements and block-level elements? Can the padding and margin of inline elements be set?
  • What is margin overlap? What is the result of the overlap?

2. JS basics

  • What data types are returned by javascript's typeof
  • Example 3 mandatory type conversions and 2 implicit type conversions
  • The difference between split() and join()
  • Array methods pop() push() unshift() shift()
  • What is the difference between event binding and normal events
  • Difference between IE and DOM event stream
  • The difference between call and apply
  • b inherits a method
  • JavaScript this pointer, closure, scope
  • How to stop event bubbling and default events
  • The difference between "" and "="
  • What are the data types in JavaScript?
  • What is the output of the following code? explain the reason.
  • foo = foo||bar , what does this line of code mean? Why write like this?
  • To complete the content of the foo() function, it is required to be able to pop up a dialog box to prompt which radio box is currently selected.
  • Complete the function showImg(), which requires the ability to dynamically update the display of the picture according to the options of the drop-down list
  • stop bubbling function
  • How much is the output?
  • Accuracy problem: JS precision can't be accurate to 0.1 so. . . . exists in both value and difference
  • output result
  • When is the end string output in the following code?
  • Please use native js to implement jquery's getpost function, and in cross-domain situations
  • Please briefly describe what aspects of web front-end performance need to be considered, and what are your optimization ideas?

3. HTML5 CSS3

  • What are the new features of CSS3
  • What are the new features of html5 and which elements have been removed? How to handle browser compatibility issues with HTML5 new tabs? How to differentiate HT
  • The difference between Local Storage and cookies (data stored on the user's local terminal)
  • How to implement communication between multiple tabs in the browser
  • How do you optimize your website's files and resources?
  • What is responsive design?
  • What are the new HTML5 document types and character sets?
  • What is the HTML5 Canvas element for?
  • What is the difference between HTML5 storage types?
  • Use H5+CSS3 to solve the problem that the last item of the navigation bar falls down
  • What are the new pseudo-classes in CSS3?
  • Please use CSS to implement: a rectangular content, with projection, rounded corners, and the hover state gradually becomes transparent.
  • Describe how to animate elements in CSS3
  • What's new in html5CSS3, and which elements have been removed? How to handle browser compatibility issues with HTML5 new tabs?
  • How do you implement the page design diagram, and how do you think the front end should complete the work with high quality? How to design a full-screen font layout

四、Ajax

  • What is Ajax How to create an Ajax?
  • Difference Between Synchronous and Asynchronous
  • How to solve cross-domain problems
  • What if the page encoding and the requested resource encoding are inconsistent?
  • Briefly describe the process of ajax.
  • Explain asynchronous loading.
  • Please explain JavaScript's Same Origin Policy.
  • Difference between GET and POST, when to use POST?
  • What is ajax? Ajax's interaction model The difference between synchronous and asynchronous How to solve cross-domain problems
  • What is the biggest feature of Ajax.
  • Disadvantages of ajax
  • The difference between get and post in ajax request
  • Explain how jsonp works, and why it's not really ajax
  • What are Ajax and JSON, their pros and cons.

Five, front-end general problems

  • What are the commonly used libraries? Common front-end development tools? What applications or components have been developed?
  • Understanding of the BFC specification?
  • What are the ways for a WEB application to actively push data from the server to the client?
  • How do you usually manage your projects, and how do you design a large-scale concurrent architecture?
  • Which operations will cause memory leaks?
  • Talk about what you think can make the project better?
  • Can rmdir in php directly delete a folder? The directory must be empty and have the appropriate permissions – from the api
  • The difference between phpinset and empty, for example
  • How to get the current execution script path in the $_SERVER variable in php
  • Write a php function that requires the difference in days between two date strings, such as the day of 2012-02-05~2012-03-06
  • How to optimize web page loading speed?


Due to space reasons, there is not much content listed. Those who need the full version of the interview summary (1) of front-end manufacturers can directly click here to receive it. I wish you all the best of luck!

concluding remarks

No matter what you do, not only the front end, you should have your own ideas and thinking, so that you can do things well and do more deeply. Otherwise, it's like a dream, and I'm still very moved when I wake up. I hope that readers will not memorize the answer when reading the above topic, but understand it and use it, and do similar things in the future, and have a reference idea. If you meet the same interviewer as me, of course, the questions are not exactly the same. At this time, you need to use your accumulation and flexible use on the spot.

Finally, I would like to add that if you have seen the general situation and learned about the general phenomenon, then if everything is the same as others, wouldn’t it also become a common level in the end? If you want to break away from the current status quo and achieve breakthroughs, then the goal should be to become a person with personality, characteristics, and distinction, and become a different front-end and different person.

Guess you like

Origin blog.csdn.net/m0_60721514/article/details/123220625