云顶娱乐集团

当前位置:云顶娱乐集团 > 云顶娱乐集团 > 有感而发,开采者才记得这么些

有感而发,开采者才记得这么些

来源:http://www.clubskodakaroq.com 作者:云顶娱乐集团 时间:2019-10-01 21:39

独有 90 时代的 Web 开垦者才记得这几个

2016/04/26 · 基本功本事 · 2 评论 · WEB

本文由 伯乐在线 - dcscodelife 翻译,艾凌风 校稿。未经许可,禁止转发!
爱沙尼亚语出处:云顶娱乐集团,holman。招待参与翻译组。

你已经强行把 <blink> 标签放入<marquee> 标签吗?近来Pique斯动画专业室获得了富有荣誉,可是在 90 时代这么些做准则是Computer动画的伟大创举。通过整合三种标签,你成为了多个先驱。叁个创新意识Infiniti的人。多个令全数人都崇拜的人。

在 90 时代,你已是四个网页开采者。

在那时候,你理解自身是二个爱不释手的人选。伴随你而来的是最最大批量的本事改进,从那时候起先,咱们还没赶趟做出喜好,技巧就早就开首复制开来了。

让大家先放下 jQuery,抛开非关系型数据库不谈:大家有更关键的事务要研讨。

File杂谈——初识file控件

2015/07/23 · HTML5 · file控件

原稿出处: 百码山庄   

第一本身说明下,这里介绍的file控件指的是网页中的FileUpload对象,也正是大家常见的<input type=”file”> 。假设您不是想搜索那上头的事物,就足以绕道了。

前面三个相关数据监察和控制

2015/08/16 · HTML5 · 数量监控

初稿出处: AlloyTeam   

品类支出成功外发后,未有二个监理系统,大家很难通晓到发表出去的代码在客商机器上实行是或不是准确,所以需求树立前端代码质量相关的监督系统。

故而大家必要做以下的有的模块:

一、搜集脚本实践错误

JavaScript

function error(msg,url,line){ var REPORT_UENVISIONL = "xxxx/cgi"; // 采摘报告数据的新闻 var m =[msg, url, line, navigator.userAgent, +new Date];// 搜聚错误音信,发生错误的本子文件网络地址,客户代理音讯,时间 var url = REPORT_U奥德赛L + m.join('||');// 组装错误报告音信内容USportageL var img = new Image; img.onload = img.onerror = function(){ img = null; }; img.src = url;// 发送数据到后台cgi } // 监听错误报告 window.onerror = function(msg,url,line){ error(msg,url,line); }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function error(msg,url,line){
   var REPORT_URL = "xxxx/cgi"; // 收集上报数据的信息
   var m =[msg, url, line, navigator.userAgent, +new Date];// 收集错误信息,发生错误的脚本文件网络地址,用户代理信息,时间
   var url = REPORT_URL + m.join('||');// 组装错误上报信息内容URL
   var img = new Image;
   img.onload = img.onerror = function(){
      img = null;
   };
   img.src = url;// 发送数据到后台cgi
}
// 监听错误上报
window.onerror = function(msg,url,line){
   error(msg,url,line);
}

通过管住后台系统,大家得以看出页面上每便错误的音讯,通过这几个音讯大家得以长足定位同一时间消除难题。

二、收集html5 performance信息

performance 满含页面加载到施行到位的满贯生命周期中区别实践步骤的推行时间。performance相关文章点击如下:选用performance API 监测页面质量

测算分裂步骤时间绝对于navigationStart的岁月差,能够由此相应后台CGI采摘。

JavaScript

function _performance(){ var REPORT_URL = "xxxx/cgi?perf="; var perf = (window.webkitPerformance ? window.webkitPerformance : window.msPerformance ), points = ['navigationStart','unloadEventStart','unloadEventEnd','redirectStart','redirectEnd','fetchStart','domainLookupStart','connectStart','requestStart','responseStart','responseEnd','domLoading','domInteractive','domContentLoadedEventEnd','domComplete','loadEventStart','loadEventEnd']; var timing = pref.timing; perf = perf ? perf : window.performance; if( perf && timing ) { var arr = []; var navigationStart = timing[points[0]]云顶娱乐网站,; for(var i=0,l=points.length;i<l;i++){ arr[i] = timing[points[i]] - navigationStart; } var url = REPORT_URL + arr.join("-"); var img = new Image; img.onload = img.onerror = function(){ img=null; } img.src = url; }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function _performance(){
   var REPORT_URL = "xxxx/cgi?perf=";
   var perf = (window.webkitPerformance ? window.webkitPerformance : window.msPerformance ),
      points = ['navigationStart','unloadEventStart','unloadEventEnd','redirectStart','redirectEnd','fetchStart','domainLookupStart','connectStart','requestStart','responseStart','responseEnd','domLoading','domInteractive','domContentLoadedEventEnd','domComplete','loadEventStart','loadEventEnd'];
   var timing = pref.timing;
   perf = perf  ? perf : window.performance;
   if( perf  && timing ) {
      var arr = [];
      var navigationStart = timing[points[0]];
      for(var i=0,l=points.length;i<l;i++){
         arr[i] = timing[points[i]] - navigationStart;
      }
   var url = REPORT_URL + arr.join("-");
   var img = new Image;
   img.onload = img.onerror = function(){
      img=null;
   }
   img.src = url;
}

由此后台接口搜集和总计,大家能够对页面推行性能有很详细的询问。

三、总括各个页面包车型大巴JS和CSS加载时间

在JS只怕CSS加载从前打上时间戳,加载之后打上时间戳,并且将数据报告到后台。加载时间反映了页面白屏,可操作的等候时间。

XHTML

<script>var cssLoadStart = +new Date</script> <link rel="stylesheet" href="xxx.css" type="text/css" media="all"> <link rel="stylesheet" href="xxx1.css" type="text/css" media="all"> <link rel="stylesheet" href="xxx2.css" type="text/css" media="all"> <sript> var cssLoadTime = (+new Date) - cssLoadStart; var jsLoadStart = +new Date; </script> <script type="text/javascript" src="xx1.js"></script> <script type="text/javascript" src="xx2.js"></script> <script type="text/javascript" src="xx3.js"></script> <script> var jsLoadTime = (+new Date) - jsLoadStart; var REPORT_URL = 'xxx/cgi?data=' var img = new Image; img.onload = img.onerror = function(){ img = null; }; img.src = REPORT_URL + cssLoadTime + '-' + jsLoadTime; </script>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script>var cssLoadStart = +new Date</script>
<link rel="stylesheet" href="xxx.css" type="text/css" media="all">
<link rel="stylesheet" href="xxx1.css" type="text/css" media="all">
<link rel="stylesheet" href="xxx2.css" type="text/css" media="all">
<sript>
   var cssLoadTime = (+new Date) - cssLoadStart;
   var jsLoadStart = +new Date;
</script>
<script type="text/javascript" src="xx1.js"></script>
<script type="text/javascript" src="xx2.js"></script>
<script type="text/javascript" src="xx3.js"></script>
<script>
   var jsLoadTime = (+new Date) - jsLoadStart;
   var REPORT_URL = 'xxx/cgi?data='
   var img = new Image;
   img.onload = img.onerror = function(){
      img = null;
   };
   img.src = REPORT_URL + cssLoadTime + '-' + jsLoadTime;
</script>

XHTML

<a href="" target="_blank"> </a>

1
<a href="https://github.com/perltzhu/js-data-report" target="_blank"> </a>

前端面试【有感而发】

2015/09/16 · HTML5, JavaScript · 1 评论 · 面试

有感而发,开采者才记得这么些。初稿出处: 聂微东(@聂微东)   

首先,这篇未有现实的面试题;

说不上,那篇仅是自身个人的面试态度;

最后,在这金三银四的跳槽季里,祝愿各位找到好干活。

吾第一次做面试官是二零一一年,想起当年本身实在非常不安(不管做如何头四次都浮动哈),但是还是在期望在面试者近期留个比较标准的记念,所以总是装作很淡定,记得那时总会放一件修身小西装放公司,特地用来面试的时候穿的,装成熟,你明白。今后回首起那时的点滴,不由自己作主的会嘴角向上:)

云顶娱乐网站 1

——————————- 低调的分水岭 ——————————-

 

“举世都缺前端” —— 这话总会被聊起,PM越发是爱慕那样说,何况依旧在劳作推进的历程中(作者会告诉您我这是在黑PM么)

面试从来是咱工作中首要性的一块,并且自个儿也垂怜去加入面试(工作忙爆的大运除了)。原因毕竟为什么其实小编自身也说不上来,大概是因为心里梦想在专门的学问时能够与智慧的人搭档呢;也只怕是梦想由此面试push自身去主动明白本行新的手艺…Anyhow,也就二头扎进了面试官的队列,且不厌其烦。

云顶娱乐网站 2

前端回忆录  

8年前的前端做些什么?页面重构(HTML+CSS)和贯彻页面交互(JS+CSS);jQuery也是在8年前出生(06年2月发表V1.0);

4年前标准提议大前端,这一贯让前面一个职位在产品和专门的职业中变得更为关键,乃至是最重视的留存,在原先的技能基础上又须求了解一门服务端语言和小量数据库的经历(从那时开头身边时有时有对象由后端转前端);

2年前的前端界Node发轫疯狂火热,且一扫各类前端论坛、开源项目,纵情的聚会者更建议“JS一统WEB开采”的世界级,数据结构轻便题的网址建设只须要二个程序员就可以化解,那正是前面一个,叼炸天呀;

Now,全端技术员???maybe…

运动互连网风光依旧,前端更是无处不在。

可是… …

招人真心难,招前端更难,招个好前端难上加难有木有~~

云顶娱乐网站 3

岂有此理意识 & 经验主义  

技术员每轮面试时间日常为一钟头左右,除非面试官对您未曾兴趣,不然不会十几分钟就打发走你(小编厂须求面试最少20分钟)。况且就在那基本上一钟头,面试官要认清你是不是切合招聘的职位,那小编正是一件特别挑衅的政工。正因为这么,所以面试官的垄断(monopoly)都有必然的高危机和不合理意识,那不可幸免。

海枯石烂原先看过一篇跟面试相关的稿子,具体内容说怎么忘记了,可是里面有一句话给自家影像深远,大概意思是:“比相当多面试官希望能招到个像本身的人,和和气好像的人”。很轻便精通那句话,因为和调谐就疑似具备更便于引起笔者的关怀,并且纪念会更加深刻。那几个“类似”俩字本人理解应该最少蕴涵多少个地点:才能方向、特性、思维方法等。

笔者也允许会带着主观意识去面试,但自己觉着那并非何等倒霉的业务。

具体点说,笔者会思量你是否会push乃至指导集体的中年人、与你合营是还是不是会开心,那也是本身参与面试的原由之一。在此,希望您沉静思索下,你在组织中是否属于那类人,至于是与不是由看官您本人评判了:)

云顶娱乐网站 4

技能一面  

习以为常状态下程序猿面试都有几轮?不管几轮都很健康,反而相当少有耳闻唯有一轮面试的,所以这里说的一面是纯手艺的面试。

一时小编会为面试面到一名杰出的同窗而欢愉不已,因为聊天会很笑容可掬,并且决定很晴朗。

越多时候小编会比较纠缠,因为本身急需思量给不给面试者通过自己那关。正因如此,其实过多时候笔者做的各类选拔皆有必然的天命元素。

小编开始时代做面试官的时候,基本都以本身积极来提问和出题,用自个儿的莫名其妙意识去观望面试者的一体。那时候想当然的认为,那份岗位须要这个XX手艺和动用这么些XX本事,所以只要面试者具有那么些知识点就足以由此。

再后来面试的阅历进步了,想知道了上学手艺、思维格局和才具技艺同样丰硕重大,全数会主要针对面试者相比擅长的领域来【交换、切磋】。

在面试这几个进度里,作者今后总会在正规面试之前,和面试者说句话:“面试正是聊天,大家简要聊聊吧”。

云顶娱乐网站 5

本来想无论是配个图,可是看到那些图形猝然想起一首儿歌:丢肥皂 丢肥皂 轻轻的放在小基友的末尾 大家不用告诉她 快点快点捉住他,快点快点捉住他…

好吧,节操碎了一地。

 

自家的期望  

上周早已安排有多少个面试。请考虑,作为一名面试官应该对您又有怎么着的只求?

吾的面试时的难题经常不定点,因为本身不欣赏背题的做法。

有早晚职业经历最棒,当然未有也一律有空子,何况有专门的学问经历对于面试也不必然都是好事。

PS:工时限制和体系经验决定了您的学问储备,所以也许有针对的调动难度和难点。

 

在小编眼里评价一名同事是还是不是能够其实非常粗大略, 看看她是否够【职业】就行了。那么合计合计,你本身相比较职业是或不是对得住专门的学业俩字。至于怎么理解专门的工作俩字,如故见仁见智吧。

简历造假或然过于夸大。夸大自个儿的劳作的确也属日常,可是一旦夸大、夸大程度都亟待有底线可言。平常走访到简历上写着理解XX,举例jQuery,然前面试的一问未有读过源码,对其细节原理说不出所以然来,那还不比不写。

记念前不久在新浪上看 @朴灵 说过:“假诺你的GitHub上向来不另外项目和代码,简历上或许别填GitHub地址了,没啥好处的。”

梦想你不用恐慌、並且自信,让本人好的单方面尽量的显示出来,努力把面试官当成您的同事,你只是与她研商工作中的难题。乃至足以多提些本身以为有趣的主张,倘若能够和面试官平素存于一个较快乐的出口情形,相信你的面试结论上,面试官一定不会小气对您进行正面包车型客车评头品足。

云顶娱乐网站 6

总结  

面试其实也是修心的经过。

自身结业开始的一段时期时找职业也并不及愿,可是一再在找职业面试的长河中不常会遇见很好的面试官,即便你未曾达到他们的地点须要,他们依然会深远的给你某个可信的提议。那么些面试进程就相当的光明,其实结果不料定是最主要的,进度也一律美貌,不是吧。

末段,请带着你主动的心态,好好享用每贰回面试。

祝好

2 赞 3 收藏 1 评论

云顶娱乐网站 7

自定义标签在IE6-8的窘境

2015/07/20 · HTML5 · IE, 自定义标签

初稿出处: 司徒正美   

想必今后前端组件化之路都以自定义标签,但那东西早在20年前,JSTL已在搞了。现在Web Component还唯有webkit援救。但三个零部件库,还亟需贰个出奇的标记它们是一块的。但是那几个XML已经帮大家化解了,使用scopeName,如”<xxx:dialog>”。在本身继续往下想怎么管理如何为这些标签绑定数据,与任何零件通讯,管理生命周期,等等大事在此以前,作者还大概有三个只好面临的标题,正是哪些宽容IE6-8!

例如以下三个页面:

云顶娱乐网站 8

在chrome, firefox, IE11, IE11的IE6宽容格局分别如下:

云顶娱乐网站 9
云顶娱乐网站 10
云顶娱乐网站 11
云顶娱乐网站 12

咱俩会发觉IE6下实际是多出累累标签,它是把闭标签也改为一个独门的成分节点

云顶娱乐网站 13

那几个AA:DIV标签被开膛破肚,里面子节点全体暴出来,成为其兄弟节点了。因而想宽容它,将在费点劲。有个多个景况要求思索,1是客户已经将它写在页面上,意况同上;2是客商是将它位于字符串模版中,这一个用正则化解。不过正则如若碰上复杂的属性名,依然会晕掉。由此笔者恐怕计划选拔原生的HTML parser。换言之,字符串,小编照旧会将它产生节点。这么办吧?!作者想了数不完方法,后来或然利用VML的命名空间法解决!

大家将地点的页面改复杂点,再看看效果!

云顶娱乐网站 14
云顶娱乐网站 15

能够看来其套嵌关系今后完全准确,而且标签名不会大写化,也不会转移多余节点!

好了,大家再判别一下是或不是为自定义标签,或然纯粹地说,这几个节点是还是不是大家组件库中定义的自定义标签。某个景况下,四个页面能够存在多套组件库,包蕴avalon的,ploymer的,只怕是直接用Web Component写的。

avalon的组件库将使用命名空间,那样就好界别开。在IE6-9中,决断element.scopeName是不是为aa(那是组件库的命名空间,你能够改个更宏大上的名字),在其余浏览器判断此因素的localName是不是以aa:开首就行了!

JavaScript

function isWidget(el, uiName){ return el.scopeName ? el.scopeName === uiName: el.localName.indexOf(uiName+":") === 0 }

1
2
3
function isWidget(el, uiName){
  return   el.scopeName ? el.scopeName === uiName: el.localName.indexOf(uiName+":") === 0
}

以此难题消除后,我们就足以开断袖之癖于自定义标签的UI库了!

1 赞 1 收藏 评论

云顶娱乐网站 16

1×1.gif

1×1.gif 应当得到巨大的格莱美大奖。只怕普利策音讯奖。恐怕类似四年级体育课上宣布的特等进步奖。除了链式链表,它是Computer科学史上最注重的成功。它不是大家应得的前景,而是大家须求的前程(直到盒子模型深透替代了它)。

如果您还没不熟稔大家的 1×1.gif 小把戏,请看上边:

云顶娱乐网站 17

您能收看它呢,让我们松手一些:

云顶娱乐网站 18

The 1×1.gif

以此 1×1.gif – 要么 spacer.gif,可能 transparent.gif – 仅仅是一个长度宽度都以多少个像素的透明 GIF 图像。

JavaScript

<IMG SRC="/1x1.gif" WIDTH=150 HEIGHT=250>

1
<IMG SRC="/1x1.gif" WIDTH=150 HEIGHT=250>

由此地点的代码,你能够把元素放置在页面包车型地铁别的任务上。

JavaScript

<TABLE> <TR> <TD><IMG SRC="1x1.gif" WIDTH=300> <TD><FONT SIZE=42>Hello welcome to my <MARQUEE>Internet Web Home</MARQUEE></FONT> </TR> <TR> <TD BGCOLOR=RED><IMG SRC="/cgi/webcounter.cgi"> </TR> </TABLE>

1
2
3
4
5
6
7
8
9
<TABLE>
  <TR>
    <TD><IMG SRC="1x1.gif" WIDTH=300>
    <TD><FONT SIZE=42>Hello welcome to my <MARQUEE>Internet Web Home</MARQUEE></FONT>
  </TR>
  <TR>
    <TD BGCOLOR=RED><IMG SRC="/cgi/webcounter.cgi">
  </TR>
</TABLE>

1×1.gif 令你轻而易举地在页面的别样位放置成分。直到后天与世长辞,它依旧是并世无双的垂直居巧月素的点子。

JavaScript

          

1
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

图形对于你来讲是还是不是太高端了?《HTML For Dummies》是否结束第四章才介绍 <IMG> 标签?未来好了,你是幸运的:&nbsp; 标签来了!

你能够对协和说,“我领会全体 HTML 实体编码。这一个弱不禁风的俊男来此地干嘛的?”

听着,笔者相亲的聪明的动人的读者朋友,那是一个现行反革命的青少年人未有予以充足重视的翻新:不断重复 &nbsp;。很像 1×1.gif 的小把戏,你能随意地扩充 &nbsp; 并用在别的你须要的地方:

JavaScript

PLEASE SIGN <BR>       MY GUESTBOOK BELOW: <HR><HR>

1
2
3
PLEASE SIGN  <BR>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;MY GUESTBOOK BELOW:
<HR><HR>

在 90 时代,假诺自己每写下一个 &nbsp; 就收获五美分,小编就能有丰裕的钱支付来自U.S.在线的每月超额支出账单了。

功能

当大家须要在网页中完成公文上传功用的时候,file控件就可以大显身手了。HTML文书档案中每增加叁个 <input type=”file”> ,实际就是创办了叁个FileUpload实例对象。顾客能够经过点击file控件选择当半夏件,当大家提交包涵该file控件的表单时,浏览器会向服务器发送客户选中的地面文件。进而将当羊眼半夏件传输到服务器,供别的网络顾客下载或使用,完结文件上传功效。

参照他事他说加以考察资料:

  • html5 performance en
  • html5 performance cn
  • javascript onerror api

    1 赞 1 收藏 评论

云顶娱乐网站 19

本文由云顶娱乐集团发布于云顶娱乐集团,转载请注明出处:有感而发,开采者才记得这么些

关键词:

上一篇:没有了

下一篇:没有了