通过canvas做得网页版五子棋游戏，界面清爽简约，通过鼠标单机完成组棋，详情见下图：
js算法代码代码：
var wins = [];
for(let i=1;i<10;i++){
wins[i] = []
for(let j=1;j<10;j++){
wins[i][j] = []
};
};
var count = 0;
for(let i=1;i<6;i++){
for(let j=1;j<6;j++){
for(let k=0;k<5;k++){
wins[i+……
Sweet Alert 是一个替代传统的 JavaScript Alert 的漂亮提示效果。SweetAlert 自动居中对齐在页面中央，不管您使用的是台式电脑，手机或平板电脑看起来效果都很棒。另外提供了丰富的自定义配置选择，可以灵活控制。界面如下图所示
使用方法：
首先在头部引入以下文件
<script src="lib/sweet-alert.min.js"></s……
当下多数网站，APP会员注册都采取手机号等方便快捷模式，本人最近在做一个移动端的登录注册界面，初稿如下图所示：
现在来具体说说我的实现方法：
其中js核心代码：
$("#Submit").click(function get_mobile(){
var mcode=Math.round(Math.random()*10000);
$.get("yanzheng.php?mobile="+$("#mobile").val()+"&mcod……
目前，网络上各大论坛，尤其是一些图片类型的网站上，在图片加载时均采用了一种名为懒加载的方式，具体表现为，当页面被请求时，只加载可视区域的图片，其它部分的图片则不加载，只有这些图片出现在可视区域时才会动态加载这些图片，从而节约了网络带宽和提高了初次加载的速度。下面来介绍两种方法：
方法一：js实现图片……
效果如图所示：
公用HTML代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js选项卡切换</title>
<style>
input { width:100px; height:50px; border: 1px solid #ddd;margin: 0 -2px;}
div { width:300px; height:100px;text-align: center……
来，直接来吧，，
一、如果是文字居中：
<div class="center"><span>hello</span></div>
则css：<style>.center { width:200px; height:100px; text-align:center; line-height:100px}</style>
这就实现了水平垂直居中，如图：
二、如果是div居中：
<div class="wrap"><……
公共部分代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>hover效果</title>
<style type="text/css" media="screen">
body {margin: 0;height: 0;background-color: #F1F1F1;}
.warp {width: 250px;height: 150px;background-color: #5e7c8……
前端的性能对于一个Web应用来说非常重要，如果一个Web应用的页面加载速度非常快、对于用户的操作可以及时响应，那么产品的用户体验将会极大地提升。（网站杜绝白屏）
以下为前端优化优化方案：
(1) 减少http请求次数：css spirit,data url // +去除网站中死链和没用的链接
(2) JS，CSS源码压缩 ……
