AngularJS项目开发技巧之localStorage存储

      注: localStorage深度学习

绪

      项目开发完毕，测试阶段发现后台管理端二维码生成有问题，问题在于localStorage的存储。如下图左所示，二维码生成完毕包含信息如下图左所示，实际二维码信息如下图右所示:

   

      经过测试发现二维码实际存储的是上一次的结果。好熟悉~Bingo,自己做导航栏高亮时就遇到过这个问题，当时就是使用的localStorage。问题还是出在localStorage身上。但是存储时：localStorage.setItem(key,value)，如果key存在，则更新value。问题的根源正是设置好值之后，value没有更新。这个说法也不对，刷新之后，value的值确实变了。只不过变的时机不对。

      回过头来看看之前二维码的生成，猛然发现原来之前使用localStorage生成的二维码也是不对的。必须得加以改进。通过Chrome调试，自己还是看出了一些问题，很明显，二维码生成早于获取订单详情信息。如下图所示:

 

      二维码生成端测试语句:

    var a = parent.document.getElementById("sunny");

     console.log("a:");

     console.log(a);

     控制器:

      document.getElementById("sunny").innerHTML = medInfo;

      

       既然这样可以正确获取到数据，问题基本上就得到了解决。

     var a = parent.document.getElementById("sunny");

     console.log("a:");

     console.log(a);

        var qrcode = new QRCode(document.getElementById("qrcode"), {

            width : 200, // 设置二维码宽高96

            height : 200

        });

qrcode.makeCode(a); // 生成二维码内容

      以上语句便可生成正确的二维码信息。

残酷的现实

      现实总是那么的残酷。生成的二维码不对，内容为空！

      

      回过头来还得继续使用localStorage,但其保存的总是上一次的值，因为二维码页面加载早于父页面，导致localStorage的值总是滞后。

      经过证实localStorage.removeItem('billInfo');确实起作用了。好纠结啊！

      纠结纠结....

      既然子页面加载较早，自己就想是不是可以通过延迟页面加载的方法解决。以下代码实现了子页面方法的延迟执行，结果亮了！可以了，我TTM佩服自己了！不容易啊！

 

<script>
// 当页面加载的时候可以调用某些函数
    window.onload = function(){
    
    	setTimeout(function(){
    	var billInfo = localStorage.getItem('billInfo');
console.log("billInfo:");
console.log(billInfo);
    	var a = parent.document.getElementById("sunny");
   	console.log("a:");
    	console.log(a);
        var qrcode = new QRCode(document.getElementById("qrcode"), {
            width : 200,	// 设置二维码宽高96
            height : 200
        });
        qrcode.makeCode(billInfo);	// 生成二维码内容
        localStorage.removeItem('billInfo');
//    qrcode.makeCode("http://192.168.1.105:8088/lmapp/billInformation.html");
    	},0.5*1000);//0.5秒后执行
    };
</script>

 

有图有真相

      

总结

      其实以上问题的解决只是绕过了localStorage,而没有实质性的解决localStorage存储问题。本质原因后期进行解决。有关子页面与父页面脚本执行先后顺序，应该是子页面较早执行，若子页面需要利用父页面中的值，则子页面脚本代码需要延迟执行。

参考文献

http://zhidao.baidu.com/link?url=yMKHEn0Q0lk1Mt1V8NPKThdZKAtugobZjZksHH2yPLYtGpByk4Vf1Q7L1SstZoGGMT98Jx1K47qviU-kxMhM2q

美文美图

 

AngularJS项目开发技巧之图片预加载

绪

      项目(移动端采用Ionic 框架)开发完毕，测试阶段发现移动APP首页的广告图片(图片由服务器端返回相应url地址)很难加载，主要原因还是网速。如下图左所示，图片加载完毕如下图右所示。

                    

问题分析

      尝试进行图片加载的优化工作。

      经过与Ionic群内卖火柴朋友的聊天，获取到如下内容:手机端访问速度受服务端带宽的限制。一个接收一个传输，和两方都有关系。服务器对app影响是很大的。2M 一般是网站使用还可以  app会不乐观。增加服务器带宽比在客户端做工作要好很多，还有就是服务图片优化。缓存机制只是下载后的事情，再说ionic的拉数据加上缓存有bug。只能是轮番 和一些固定图片可以使用。因此考虑使用缓存机制的策略暂时告吹。

问题解决

      提升服务端带宽。2M-->?M

      在这里只是提供一个解决问题的思路，若大家有什么好的建议或想法可以给我留下你宝贵的评论，谢谢。

美文美图

  

[开发技巧]·PyTorch如何使用GPU加速（CPU与GPU数据的相互转换）


配合本文推荐阅读：PyTorch中Numpy，Tensor与Variable深入理解与转换技巧

关联阅读：

[深度应用]·主流深度学习硬件速度对比（CPU，GPU，TPU）

[开发技巧]·TensorFlow&Keras GPU


1.问题描述

在进行深度学习开发时，GPU加速可以提升我们开发的效率，速度的对比可以参照笔者这篇博文：[深度应用]·主流深度学习硬件速度对比（CPU，GPU，TPU）结论：通过对比看出相较于普通比较笔记本的(i5 8250u)CPU，一个入门级显卡(GPU MX150)可以提升8倍左右的速度，而高性能的显卡(GPU GTX1080ti)可以提升80倍的速度，如果采用多个GPU将会获得更快速度，所以经常用于训练的话还是建议使用GPU。

在PyTorch中使用GPU和TensorFlow中不同，在TensorFlow如果不对设备进行指定时，TensorFlow检测到GPU就会把自动将数据与运算转移到GPU中。而PyTorch类似于MxNet，需要显性的指定数据和运算放在哪里执行，这样的操作比较自由，却也有些繁琐。因为如果哪一步忘记转换了就会运行出错。

本文在数据存储的层面上，帮大家解析一下CPU与GPU数据的相互转换。让大家可以掌握PyTorch使用GPU加速的技巧。

2.原理讲解

使用GPU之前我需要安装PyTorch的GPU版本，建议使用conda安装，官方教程地址

conda install pytorch torchvision cudatoolkit=9.0 -c pytorch

检测是否可以使用GPU，使用一个全局变量use_gpu，便于后面操作使用

use_gpu = torch.cuda.is_available()

可以使用GPU，use_gpu的值为True，否则为False。当可以使用GPU，我们不想使用，可以直接赋值use_gpu = False

我们在进行转换时，需要把数据，网络，与损失函数转换到GPU上

1.构建网络时，把网络，与损失函数转换到GPU上

model = get_model()
loss_f = t.nn.CrossEntropyLoss()
if(use_gpu):
    model = model.cuda()
    loss_f = loss_f.cuda()

2.训练网络时，把数据转换到GPU上

if (use_gpu):
    x,y = x.cuda(),y.cuda()

3.取出数据是，需要从GPU准换到CPU上进行操作

if(use_gpu):
    loss = loss.cpu()
    acc = acc.cpu()

进一步的对数据操作可以查看笔者这篇博文：[开发技巧]·PyTorch中Numpy，Tensor与Variable深入理解与转换技巧

 


欢迎大家关注小宋公众号《极简AI》带你学深度学习：这里收集了一些比较适合入门实战的PDF书籍，覆盖TensorFlow、PyTorch与MXNet。推荐的理由是通俗易懂，适合初学者研究学习。书籍列表如下：《简单粗暴TensorFlow2最新中文版》《动手学深度学习PyTorch最新中文版》《动手学深度学习MXNet最新中文版》

关注后，回复：书籍，领取。



基于深度学习的理论学习与应用开发技术分享，笔者会经常分享深度学习干货内容，大家在学习或者应用深度学习时，遇到什么问题也可以与我在上面交流知无不答。

出自CSDN博客专家&知乎深度学习专栏作家--小宋是呢

moodle开发技巧
一.更换主题：
1.将下载.zip主题文件解压，并负责到moodle根目录的theme文件夹下。
2.进入moodle网站，登录管理员账号，在外观---主题风格中更新安装主题插件，并选用新的插件即可。