头图

python又搞事情 想一统天下?

python最近又在搞大事情,就在最近,github上突然多了一个神奇的项目: git地址.
并且最近一直在更新。一看这个名字就让我们不禁想起JavaScript,再去官网一看pyscript官网, 这家伙不仅模仿了JavaScript的名字,甚至连身子都想要取而代之!
官方对pyscript的期望是可以在浏览器上直接运行python。

<html>|

    ...|

    <py-script> print('Now you can!') </py-script>|

</html>|

怀着一颗好奇心,我们把github上的代码克隆下来,发现是一个基于node的前端项目,那第一步先把他跑起来!
进入\pyscript-main\pyscriptjs目录下,

  1. 首先安装依赖 cnpm i
  2. 然后先在本地运行 npm run dev
  3. 打开 http://localhost:8080/

首页是一个纯纯的html文件,在\pyscript-main\pyscriptjs\examples目录下的index.html,如下图:

img.png

我们先来看看最简单的Hello world页面,如下图:

img_1.png

页面确实够简单,再看看它的代码:

 <body>
    Hello world! <br>
    This is the current date and time, as computed by Python:
    <py-script>
from datetime import datetime
now = datetime.now()
now.strftime("%m/%d/%Y, %H:%M:%S")
    </py-script>
  </body>

想必大家都可以看得懂这段代码,精彩的点在于,只要在<py-script>标签中,就可以直接使用python语法来进行操作了,并且似乎比JavaScript还要直接嗷,甚至还有点数据绑定的意思。

再来看看另一个经典的例子,todo_list,对应todo.html,如下图:

img_2.png

再看代码:

...
 <py-script src="/todo.py">  </py-script>
...
<section>

    <div class="text-center w-full mb-8">
      <h1 class="text-3xl font-bold text-gray-800 uppercase tracking-tight">To Do List</h1>
    </div>
    <div>
      <input id="new-task-content" class="border flex-1 mr-3 border-gray-300 p-2 rounded" type="text">
      <button id="new-task-btn" class="p-2 text-white bg-blue-600 border border-blue-600 rounded" type="submit" pys-onClick="add_task">
        Add task
      </button>
    </div>

    <py-list id="myList"></py-list>
    <div id="list-tasks-container" class="flex flex-col-reverse mt-4">
  </div>

    <template id="task-template">
        <section class="task bg-white my-1">
            <label for="flex items-center p-2 ">
              <input class="mr-2" type="checkbox" class="task-check">
              <p class="m-0 inline"></p>
            </label>
        </section>
      </template>

  </section>

在代码最上面竟然引入了一个.py文件,代码中使用pys-onClick绑定了add_task方法,而add_task方法在引入的todo.py中进行了声明:

def add_task(*ags, **kws):
   ...

也就是说,pyscript真的可以做到和JavaScript在浏览器中运行时一样的调用体验,甚至还可以在浏览器中引用python类库!
在另一个todo_pylist.html页面中,提供了直接在浏览器中运行python命令的方法,

img_3.png

为了显示自己在处理复杂图形方面的能力,示例中还提供了和three.js结合而成的webgl示例页面:

img_4.png
和一些图表页面:

img_5.png

可以看到,在功能实现上,pyscript基本可以实现JavaScript能够实现的功能。

不过从目前的体验上来看,在浏览器上运行python属实是够慢的,每次打开页面都得等好几秒,并且第一次打开页面的时候竟然还要下载python类库,github上已经有人提出了这个问题,并且官方回答他们已经努力了,并且还在继续努力。

有网友说又可以少掌握一门语言多实现一项功能。不过从目前用户体验这个角度来看,pyscript想要取代JavaScript在浏览器上的地位可能还有一段路要走,但是却给我们提供了玩python的另一条新道路。pyscript还可以朝着哪些方面发展,欢迎大家提出自己的看法。


Spring Boot从入门到精通
Spring Boot从入门到精通
1.6k 声望
4.3k 粉丝
0 条评论
推荐阅读
未来已来,新一代AI以假乱真
ChatGPT是一种基于Transformer架构的语言模型,它通过预训练大量文本数据来学习语言特征。在预训练阶段,ChatGPT模型被训练成能够预测文本序列的下一个词语。在应用阶段,它可以用来进行对话,问答,文本生成等任...

我的小熊不见了阅读 788

从零搭建 Node.js 企业级 Web 服务器(零):静态服务
过去 5 年,我前后在菜鸟网络和蚂蚁金服做开发工作,一方面支撑业务团队开发各类业务系统,另一方面在自己的技术团队做基础技术建设。期间借着 Node.js 的锋芒做了不少 Web 系统,有的至今生气蓬勃、有的早已夭折...

乌柏木148阅读 12.2k评论 10

JavaScript有用的代码片段和trick
平时工作过程中可以用到的实用代码集棉。判断对象否为空 {代码...} 浮点数取整 {代码...} 注意:前三种方法只适用于32个位整数,对于负数的处理上和Math.floor是不同的。 {代码...} 生成6位数字验证码 {代码...} ...

jenemy46阅读 5.9k评论 12

从零搭建 Node.js 企业级 Web 服务器(十五):总结与展望
总结截止到本章 “从零搭建 Node.js 企业级 Web 服务器” 主题共计 16 章内容就更新完毕了,回顾第零章曾写道:搭建一个 Node.js 企业级 Web 服务器并非难事,只是必须做好几个关键事项这几件必须做好的关键事项就...

乌柏木66阅读 6.1k评论 16

再也不学AJAX了!(二)使用AJAX ① XMLHttpRequest
「再也不学 AJAX 了」是一个以 AJAX 为主题的系列文章,希望读者通过阅读本系列文章,能够对 AJAX 技术有更加深入的认识和理解,从此能够再也不用专门学习 AJAX。本篇文章为该系列的第二篇,最近更新于 2023 年 1...

libinfs39阅读 6.3k评论 12

封面图
从零搭建 Node.js 企业级 Web 服务器(一):接口与分层
分层规范从本章起,正式进入企业级 Web 服务器核心内容。通常,一块完整的业务逻辑是由视图层、控制层、服务层、模型层共同定义与实现的,如下图:从上至下,抽象层次逐渐加深。从下至上,业务细节逐渐清晰。视图...

乌柏木43阅读 7.3k评论 6

CSS 绘制一只思否猫
欢迎关注我的公众号:前端侦探练习 CSS 有一个比较有趣的方式,就是发挥想象,绘制各式各样的图案,比如来绘制一只思否猫?思否猫,SegmentFault 思否的吉祥物,是一只独一无二、特立独行、热爱自由的(&gt;^ω^&lt...

XboxYan43阅读 2.9k评论 14

封面图
1.6k 声望
4.3k 粉丝
宣传栏