Beefy Boxes and Bandwidth Generously Provided by pair Networks
Do you know where your variables are?
 
PerlMonks  

Run Perl 5 in the Browser!

by haukex (Canon)
on Aug 16, 2018 at 12:10 UTC ( #1220426=perlnews: print w/replies, xml ) Need Help??

Have you ever wanted to do this?

<html> <head> <title>Hello, Perl World!</title> <script type="text/perl"> print "Hello, Perl World!\n"; </script> </head> <body></body> </html>

Well, now you can!* :-)

I just released what I'm calling WebPerl - please see the website for all the documentation, downloadable demo, and source code. It's still very much in beta, and your feedback is very welcome!

I gave a lightning talk on it yesterday at YAPC::EU 2018 in Glasgow, you can see the recording of the live stream here (link should go to 8h9m40s). Update: The video seems to have gone down, unfortunately. Will update once something is back up, for now the website contains all the documentation. Update 2: Video is back up, thanks for pointing it out, Corion! New Video Link (link should go to 8h12m)

* Update: What you need to do to make the above example work is download WebPerl, put the files in the same directory as the HTML file, and add <script src="webperl.js"></script> in the above HTML - then you should get the output of the print in your browser's JavaScript console. The website also gives some more "quick start" instructions.

Update 2: I have since posted a few more nodes on WebPerl:

Replies are listed 'Best First'.
Re: Run Perl 5 in the Browser!
by LanX (Archbishop) on Aug 16, 2018 at 14:06 UTC
    Hauke that's awesome!!!

    I personally have a (too) long running project to exploit the semantic similarities for this goal and already put a lot of theoretical work into it.

    JS is for 98% a simplified Perl, and patching B::Deparse to emit native JS should be possible.

    But I was confronted with some problems:

    • How to translate RegExes, since JS only supports the Perl4 (sub) standard
    • How to handle eval , since compiling the op-tree still needs a Perl parser.
    • How to cover the remaining 2 %
    • (update) How to cover XS code

    Your approach could at least solve the eval bottleneck, my approach could probably lead to faster code and less footprint.

    If you're interested I'd love to contribute, even meeting in Berlin for discussion.

    Cheers Rolf
    (addicted to the Perl Programming Language :)
    Wikisyntax for the Monastery FootballPerl is like chess, only without the dice

    ) not sure how you solve this, does asm.js also cover the regex engine? My idea was to use re qw/debug/ to emit an "regex-optree" and translate this.

      not sure how you solve this, does asm.js also cover the regex engine?

      I'm compiling a whole perl binary to WebAssembly, including the regex engine and everything. I haven't gotten very far on porting Perl's test suite yet, because it makes use of some of the stuff that isn't supported (e.g. qx and signals), but the tests I was able to run have looked good so far.

      patching B::Deparse to emit native JS should be possible

      That's an interesting idea, and perhaps something I could think about is how to optimize code like the example I showed on the website:

      js('document')->getElementById('my_button') ->addEventListener('click', sub { js('window')->alert("You clicked the button!"); } );

      Running that invokes the JS/Perl glue three times (five if the callback is called), which isn't super efficient at the moment because it does a lot with strings and eval. One possible way to optimize that might be if there was a way to convert at least the first few method calls to

      js('document.getElementById("my_button").addEventListener("click",func +tion(){...})');
        I'm open for discussions, you might also be interested in the work of Flavio Glock and his perlito.

        update

        A general approach for performance enhancements could be to run Perl your way and to replace time consuming inner functions with direct JS translations.(kind of JIT if you want).

        From the Perl perspective these functions would have been monkey patched with XS code.

        Cheers Rolf
        (addicted to the Perl Programming Language :)
        Wikisyntax for the Monastery FootballPerl is like chess, only without the dice

Re: Run Perl 5 in the Browser!
by afoken (Abbot) on Aug 17, 2018 at 10:00 UTC

    Have you ever wanted to do this?

    <html> <head> <title>Hello, Perl World!</title> <script type="text/perl"> print "Hello, Perl World!\n"; </script> </head> <body></body> </html>

    Nice, but you omitted an important line from the example:

    <script src="webperl.js"></script>

    I did not try it yet, but I like the idea. Running Perl in the browser is nothing new, it is part of ActivePerl since at least 2001, but their implementation is limited to some versions of the IE, and it is by default limited to the local net, because the perl interpreter was not limited to the browser context (i.e. you could run any code as the user running the IE by simply making the user visit a website containing perl code). See also Re^2: Can Perl do anything Java can do?.

    Alexander

    --
    Today I will gladly share my knowledge and experience, for there are no sweeter words than "I told you so". ;-)

      Thanks, you're right, the example is just showing the "what I'd like to be able to do part" - I updated the node to the include webperl.js part too.

Re: Run Perl 5 in the Browser!
by marto (Archbishop) on Aug 16, 2018 at 12:16 UTC

    I was lucky enough to see this yesterday, great work. Can't wait to play around with it. Thanks.

Re: Run Perl 5 in the Browser!
by kcott (Chancellor) on Aug 17, 2018 at 09:38 UTC

    G'day haukex,

    I wanted to view the "recording of the live stream" you linked to but encountered problems.

    The link you posted in the OP is: https://youtu.be/SR0Grhiw8xI?t=29380. That resolved in my browser (Firefox 61.0.1) to: https://www.youtube.com/watch?v=SR0Grhiw8xI&feature=youtu.be&t=29380 (both when following the OP link and pasting that URL directly into the browser). In both cases, all I got was a black rectangle containing an exclamation mark (where the video normally appears); all the other elements on the page (search entry field, "Up next" thumbnail, etc.) were just plain grey boxes.

    And, although I noted that "8h9m40s" is 29380s, I also tried with ?t=29380 and &t=29380 removed: same result in both cases.

    Please look into this: I'm still interested in viewing the talk.

    — Ken

      I was talking to the conference organisers today, they're going to chop up the huge streams and replace them with one video per talk. It looks like the stream of that room for day one is not currently available right now. Shadow Cat channel would be worth following/keeping an eye on.

        ++ Thanks for the quick response. I'll keep an eye on the Shadowcat link you provided.

        — Ken

      Yes, sorry, the link worked on the first day when I posted the node, but apparently that stream got taken down. Once they upload the individual videos I'll update the link. Update: The video is back up, see root node!

Re: Run Perl 5 in the Browser!
by ikegami (Pope) on Aug 23, 2018 at 01:35 UTC

    For the longuest time, ActiveState produced PerlScript, which provided exactly the same thing. But PerlScript was a non-portable browser plugin, so this is way better.

Re: Run Perl 5 in the Browser!
by Anonymous Monk on Oct 05, 2018 at 17:03 UTC
    How can you a access the Dom with Perl?Are you exposing an API or you have a DSL?
      Are you exposing an API or you have a DSL?

      In Perl scripts running inside WebPerl, I expose all of JavaScript to Perl, in two ways:

      1. The js() function from the WebPerl module, which takes an arbitrary string of JavaScript code to execute, and
      2. the return values of the the js() function:
        • strings, numbers, and booleans are copied from JS to Perl, but
        • when the JavaScript code returns an object, array, or function, then as LanX said, WebPerl will return a proxy object of the class WebPerl::JSObject, which overloads array, hash, and code dereferencing, as well as does method autoloading. So when you do any of those operations on those Perl objects, WebPerl will internally build a string of JavaScript code that accesses the original JavaScript object and run that via js(). When it does this, WebPerl copies any assigned values and arguments to functions or methods from Perl to JavaScript, and also wraps subs inside JS functions that, when called, call back into Perl to run the sub (including arguments).

      So this way, you can do everything in Perl, and use normal Perl operations to manipulate Perl objects, which actually runs JavaScript in the background.

      The interface is documented here. The gory guts can be found in WebPerl.pm and WebPerl.xs (with some supporting code, such as Perl.glue() and Perl.dispatch(), in webperl.js). (You'll see that currently, a lot is done with copying strings back and forth between JS and Perl, and with both JS's and Perl's eval, which in some places could probably be optimized in a future version.)

      How can you a access the Dom with Perl?

      Since you can use all of JavaScript, you can use native JS (like the example LanX showed), or any JavaScript library of your choice, such as jQuery. I show examples of both in the source webperl_demo.html (don't mind the currently screwy syntax highlighting on GitHub that's highlighting stuff in dark red). Let me know if you have any further questions!

      Minor edits to add a few small details.

      From what I understood it's implemented on the Perl side as XS-code inlining JS code and returning proxy objects.

      There where various examples how it looks like in this thread.

      e.g. in Re^2: Run Perl 5 in the Browser!

      js('document')->getElementById('my_button') ->addEventListener('click', sub { js('window')->alert("You clicked the button!"); } );

      so you could interpret method chaining as a "DSL" (at least Fowler does)

      Cheers Rolf
      (addicted to the Perl Programming Language :)
      Wikisyntax for the Monastery FootballPerl is like chess, only without the dice

Re: Run Perl 5 in the Browser!
by Anonymous Monk on Aug 20, 2018 at 11:07 UTC
    Idea: plumb text::csv/xs to javascript library pappaparse

      Why use a Javascript library for CSV parsing when Text::CSV_XS can be bundled with WebPerl and provide all CSV parsing already?

      Update: On the other hand, if you don't have Perl in your browser, Papa Parse seems to be a Javascript CSV parser.

        So webperl doesnt tra slate to js? I thought it did. Oh well

Log In?
Username:
Password:

What's my password?
Create A New User
Node Status?
node history
Node Type: perlnews [id://1220426]
help
Chatterbox?
and the web crawler heard nothing...

How do I use this? | Other CB clients
Other Users?
Others taking refuge in the Monastery: (5)
As of 2018-12-14 04:08 GMT
Sections?
Information?
Find Nodes?
Leftovers?
    Voting Booth?
    How many stories does it take before you've heard them all?







    Results (64 votes). Check out past polls.

    Notices?