Today's Question:  What's your opinion about Alibaba mooncake incident?        GIVE A SHOUT



  Relationship oriented website vs content oriented website

Relationship oriented website is a kind of website based on friend circle, people come to the website to share news with their friends and see what's happening around their friends, these websites include Facebook, Twitter and Tumblr. While content oriented website is a kind of website based on unique content, people come to the website to find information or find answers for their questions, these websites include TechCrunch, The Verge and Medium. Most of websites on the Internet nowadays belon...


  Best practices of front end optimization

1. Use DocumentFragment or innerHTML to replace complex elements insertion DOM operation on browser is expensive. Although browser performance is improved much, multiple DOM elements insertion is still expensive and will affect the page load speed. Assume we have an ul element on our page, we now want to retrieve a JSON list using AJAX and then update the ul using JavaScript. Usually we may write it as : var list = document.querySelector('ul'); ajaxResult.items.forEach(function(item) { // ...


  Difference between sans-serif and serif font

When we design website, we will often need to choose which font to use while displaying contents on the page. Basically what's the criteria for the choice? There are two big families of fonts : sans-serif and serif. We need to first understand what the difference is between these two. The word sans is from French, the meaning of it is without. So the difference between sans-serif and serif is serif font will have lines in all ends of the character while sans-serif fonts don't have. Some examples...

1,918 0 0          SANS-SERIF SERIF FRENCH

  Content based HTTP Cache

Browsers may cache the webpages we visited, when user types a URL on the address bar, the browser may cache the webpage returned from server while displaying it. If there is no update on the webpage, then next time when the browser requests the same page, it will not download the page again, instead it will load the cached page. If the website explicitly specify that the page is updated, then the browser will download the page again from the server. What's HTTP Cache? You may be familiar with th...

1,856 0 0          HTTP CACHE WEB CRAWLER

  Video website in big data era

Big data initially means the large data set which is not able to be analyzed, but later it was derivatized to the method to analyze huge amounts of data in  order to gain great value.This is a form which gradually gets attention, It's difficult to analyze these data and it's also difficult to store these data and it needs some unprecedented way, Now in China many companies use the open source Hadoop distributed data cluster to meet the needs of data statistics. Since we can get segmented d...


  CSS and HTML5 responsive images

With the popularity of Retina screen, the requirement of the images in the webpages is higher. How to make sure the image still clear while enlarging twice on retina screen? This brings much trouble to web developers, the good news is CSS3 and HTML5 is trying to change this, we can use response image. What is responsive image? It means user agent loads different images according to different resolutions of output devices, it will not waste bandwidth as well. In addition, it can load respective ...


  Beauty of front end--List of front end tools used by GitHub

I did this summarization when I added Lirate_CoffeeScript support for GitHub-Linguist, i.e how does GitHub do Marjdown render and code highlight in its front end. Lots of font end tools used by GitHub are open sourced. They are: 1. HTML/CSS/JavaScript 1.1 HTML template GitHub markup and template styleguide : 1.2 Style and CSS GitHub uses replacement of CSS: SCSS: KSS: GitHub CSS styleguide : http...

3,385 0 1          GITHUB TOOL FRONT END

  Turn browser into notepad with one line of code

This is the code shared by Jose on codewall. When you type data:text/html,   into the address bar of the browser and press enter, the browser will turn into a notepad which you can edit. Why it works? This uses Data URI’s format and it tells the browser to render HTML. But contenteditable is a property of HTML5, so this can only work in the web browser which supports this property. Here are some interesting contents. Some people make some changes to the code encouraged by the ide...

2,478 0 0          HTML5 BROWSER EDITOR